vue2 单页面适配 h5 和 pc 两种版本

在create时就判断h5和pc版本

检测用户设备是否为移动设备

通过检查用户代理字符串中是否包含特定的关键字来判断。如果检测到移动设备，isMobile 变量将被设置为 true

<div v-if="isMobile"></div>
<div v-else class="pcbgc"></div>

isMobile: false

created () {
    const userAgent = window.navigator.userAgent;
    if (/Mobile|Android|iPhone|iPod|iPad|Windows Phone/i.test(userAgent)) {
      // 如果是在移动端打开，则认为当前设备是移动设备
      this.isMobile = true;
    }

  },
  
  

pcbgc类中样式 的px/2 就是pc端大小尺寸

  <div class="nav_scroll" :style="isMobile ? '' :{'height': '100px','line-height': '50px'}"></div>
  

这段内容判断 如果isMobile 就是true 则默认 否则给她定行内样式给pc端版本