绵阳梓潼网站制作公司

用vue如何实现手机触屏滑动功能的代码示例

这篇文章主要讲解了用vue如何实现手机触屏滑动功能的代码示例，内容清晰明了，对此有兴趣的小伙伴可以学习一下，相信大家阅读完之后会有帮助。

成都创新互联公司专注于企业成都全网营销、网站重做改版、嘉禾网站定制设计、自适应品牌网站建设、H5建站、商城开发、集团公司官网建设、成都外贸网站制作、高端网站制作、响应式网页设计等建站业务，价格优惠性价比高，为嘉禾等各大城市提供网站开发制作服务。

功能：iview Carousel 走马灯，我需要在phone上实现滑动切换功能。



 
 
 
 
 
 
 
 
 


data() {
return {
 phone_mouseMIndex: 0, // phone端 滑动索引
 phone_mouseMX0: 0, // phone端 滑动索引
 phone_mouseMX1: 0, // phone端 滑动索引
}
},
...
// phone端 滑动开始
phone_mouseS(e){
 this.phone_mouseMX0 = e.changedTouches[0].pageX;
},
// phone端 滑动结束
phone_mouseE(e){
 this.phone_mouseMX1 = e.changedTouches[0].pageX;
 let tag = this.phone_mouseMX1 - this.phone_mouseMX0;
 if(tag >= 50){
 if(this.phone_mouseMIndex > 0){
 this.phone_mouseMIndex--;
 }else{
 this.phone_mouseMIndex = 2;
 }
 }
 if(tag <= -50){
 if(this.phone_mouseMIndex < 2){
 this.phone_mouseMIndex++;
 }else{
 this.phone_mouseMIndex = 0;
 }
 }
}

看完上述内容，是不是对用vue如何实现手机触屏滑动功能的代码示例有进一步的了解，如果还想学习更多内容，欢迎关注创新互联行业资讯频道。


网站标题：用vue如何实现手机触屏滑动功能的代码示例
文章源于：http://myzitong.com/article/gecpod.html

其他资讯