• 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             }
  • 相关阅读:
    POJ-1182 食物链
    P1020 导弹拦截
    牛客寒假训练营2-C算概率
    牛客寒假训练营2-H施魔法
    牛客寒假算法训练营2-建通道
    D
    C
    A
    B
    【Luogu3366】【模板】最小生成树
  • 原文地址:https://www.cnblogs.com/summer0319/p/8422318.html
Copyright © 2020-2023  润新知