vue中使用vue-touch

如果想让vue能够监听移动端的上滑、下滑、左滑、点击等等动作，可以使用vue-touch插件。vue-touch的使用十分简单。

首先在vue项目中安装vue-touch

npm install vue-touch@next --save

然后在main.js或mian.ts上导入并使用：

import VueTouch from "vue-touch";
Vue.use(VueTouch, {name: "v-touch"});

使用来包裹要使用vue-touch的元素

 
        

          

            

              
            
            
{{ item.title }}
            
{{ item.rate }}
          
        

使用@touch.js的事件名="函数名( )"来使用vue-touch

methods: {
    nowLeft() {
      // 获取list
      let now = document.getElementsByClassName("list")[0];
      now.style.transform += "translateX(-30rem)";
      now.style.transition = "all ease 0.5s";
    },
    nowRight() {
      // 获取list
      let now = document.getElementsByClassName("list")[0];
      now.style.transform += "translateX(30rem)";
      now.style.transition = "all ease 0.5s";
      },
  },

touch.js常用事件