因为@touchstart,@touchmove,@touchend在谷歌浏览器上面可以正常,但是在微信浏览器上面会失效,所有需要判断是否是微信浏览器来进行不同的操作代码如下:
mounted() {
let ua = navigator.userAgent.toLowerCase();
if (ua.match(/MicroMessenger/i) == "micromessenger"){
//是微信浏览器
let that = this
this.$refs.lu.$el.onmousedown = function(event) {
// 处理 touchstart 事件
this.x1 = event.x
}
this.$refs.lu.$el.onmousemove = function(event){
// console.log('移动',event);
}
this.$refs.lu.$el.onmouseup = function(event){
let endX = event.x
let zhong = parseInt(+endX - this.x1 * 1)
if (zhong > 50 || zhong < -50) {//判断向左向右滑动是否大于或者小于50,如果符合就进行切换组件操作
that.$store.commit('mutationsShow','vi')
}
}
}else{
//不是微信浏览器可以直接使用@touchstart,@touchmove,@touchend去定义函数
}
},