场景 如果是移动端, 则进入h5页面去download,如果是PC 则进入官网首页
方案

在这里插入图片描述

 methods: {
    // 判断移动端还是pc端
    _isMobile() {
      let flag = navigator.userAgent.match(
        /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i
      )
      return flag
    }
  },
  mounted() {
    if (this._isMobile()) {
      console.log('isMobile')
      this.$router.push({ name: 'mobile' })
    }
  }
场景 在移动端 点击下载后, 判断 是微信 安卓 iOS

在这里插入图片描述

  downLoad() {
      let ua = navigator.userAgent.toLowerCase()
      //android终端
      let isAndroid = ua.indexOf('Android') > -1 || ua.indexOf('Adr') > -1 //ios终端
      let isiOS = !!ua.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)
      if (isWeixinBrowser()) {
        this.ShowDark = !this.ShowDark
        alert('我是微信')
      } else {
        if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
          //ios
          alert('ios')
          window.location = 'http://www.baidu.com'
        } else if (/(Android)/i.test(navigator.userAgent)) {
          //android
          alert('安卓')
          window.location = 'http://www.taobao.com'
        }
      }

      function isWeixinBrowser() {
        return /micromessenger/.test(ua) ? true : false
      }
    },
参考链接: https://blog.csdn.net/qq_39603448/article/details/87251424
Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐