1.第一步

​

data(){

return{

isMobile: false,

}

}
​

2.第二步

created(){
     window.addEventListener('resize', this.checkMobile);
     this.checkMobile(); // 初始化时进行一次判断   
}

3.第三步

destroyed() {

   window.removeEventListener('resize', this.checkMobile);

},

4.第四步

methods: {

   checkMobile() {

      this.isMobile = window.innerWidth <= 767;

      console.log(this.isMobile)  

   }

},

如果是手机端那么这个isMobile就是true否则就是false

引用:

如果是手机端访问就显示

<div i-if="isMobile">

</div>

不是手机端的话就是

<div i-if="!isMobile">

</div>

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐