安装 vue-touch 插件

npm install vue-touch@next --save

main.js中引入

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

<el-carousel :interval="4000" indicator-position="outside" height="840px" ref="carousel">
  <el-carousel-item v-for="(item,index) in banners" :key="item.url">
    <v-touch :swipe-options="{direction: 'horizontal'}" v-on:swipeleft="swiperleft(index)" v-on:swiperight="swiperright(index)" class="wrapper">
    <div class="menu-container" ref="menuContainer">   
      <img v-lazy="item.url"/>
    </div>
   </v-touch>
  </el-carousel-item>
</el-carousel>

methods: {
    //设置滑动切换轮播图
    swiperleft: function (index) {
      //上一页
      this.$refs.carousel.prev();
      //设置幻灯片的索引
      this.$refs.carousel.setActiveItem(index - 1);
    },
    swiperright: function (index) {
      //下一页
      this.$refs.carousel.next();
      this.$refs.carousel.setActiveItem(index + 1);
    },
},

发现BUG：vue-touch不能上下滑动的问题

.wrapper {
  touch-action: pan-y !important;
}