如何在小屏幕/移动设备上运行一些JavaScript代码

Question

我正在构建一个将在所有设备上使用的vue Web应用程序.我有一些代码,我想只在小型设备或移动设备上执行.目前我在if条件下有代码$(window).width(),如下所示:

if ($(window).width() <= 768) {
  //My mobile specific code
}

有没有更好的方法或vue方式这样做？

编辑

例如,我有一个组件:

export default {
  data () {
    return {
      fade: false,
      showFilter: $(window).width() > 768
    }
  },
  components: { PrFilter, Pr },
  created () {
    if ($(window).width() <= 768) {
      bus.$on('pr-changed', () => {
        this.showFilter = false
        this.fade = false
      })
    }
  }
}

在另一个组件中,我有:

watch: {
  matchingPr: function (filteredPr) {
    if (filteredPr.length) {
      this.pr = filteredPr[0]
      if ($(window).width() <= 768) {
        bus.$emit('pr-changed')
      }
    }
  }
},

Answer 1

您可以使用

function detectmob() { 
 if( navigator.userAgent.match(/Android/i)
 || navigator.userAgent.match(/webOS/i)
 || navigator.userAgent.match(/iPhone/i)
 || navigator.userAgent.match(/iPad/i)
 || navigator.userAgent.match(/iPod/i)
 || navigator.userAgent.match(/BlackBerry/i)
 || navigator.userAgent.match(/Windows Phone/i)
 ){
    return true;
  }
 else {
    return false;
  }
}

navigator.userAgent方法.