h5 左右滑动切换tab栏 

 1             on: {
 2                 touchstart(e){
 3                     e.preventDefault();
 4                     var touch = e.touches[0];
 5                     startX = touch.pageX;
 6                     startT = new Date().getTime(); //记录手指按下的开始时间
 7                     // isMove = false; //是否产生滑动
 8                 },
 9                 touchmove(e){
10                     // console.log('touchmove', e);
11                     e.preventDefault();
12                     var touch = e.touches[0];
13                     var deltaX = touch.pageX - startX;
14                 },
15                 touchend(e){
16                     // console.log(e)
17                     var touch = e.changedTouches[0]
18                     var endX = touch.pageX
19                     
20                     var index = me.list.indexOf(me.value)
21 
22 
23                     var deltaT = new Date().getTime() - startT;
24                     
25                     var deltaX = touch.pageX - startX;
26                     if (deltaT < 300){
27                         if (deltaX > 0){
28                             console.log('index', index);
29                             
30                             if (index === 0) {
31                                 index = me.list.length
32                             }
33                             me.$emit("input", me.list[--index])
34                         } else if (deltaX < 0) {
35 
36                             if (index === me.list.length - 1) {
37                                 index = -1
38                             }
39                             me.$emit("input", me.list[++index])
40                             console.log('index', index);
41                             
42                         }
43                     } else {
44 
45                         if (deltaX > bodyWidth * 0.5){
46                             console.log('index', index);
47                             
48                             if (index === 0) {
49                                 index = me.list.length
50                             }
51                             me.$emit("input", me.list[--index])
52                         } else if (deltaX < -bodyWidth * 0.5) {
53 
54                             if (index === me.list.length - 1) {
55                                 index = -1
56                             }
57                             me.$emit("input", me.list[++index])
58                             console.log('index', index);
59                             
60                         }
61                     }
62                     
63                         
64                     me._getActiveNav()
65                 }
66             }

 

posted @ 2018-02-06 14:43  rrranmo  阅读(2081)  评论(0)    收藏  举报