vue vant关于swipe的使用(按需引入具体步骤)

需要先安装vant

npm i vant -S

1、自己建一个文件夹plugins,里面建一个vant.js文件

vant.js里面的

// 按需全局引入 vant组件
import Vue from 'vue'
import {List, Cell, Tabbar, TabbarItem,Swipe,Overlay,SwipeItem,
  Lazyload } from 'vant'
import 'vant/lib/index.css';

Vue.use(Cell)
Vue.use(List)
Vue.use(Swipe)
Vue.use(Overlay)
Vue.use(SwipeItem)
Vue.use(Lazyload)
Vue.use(Tabbar).use(TabbarItem)

2、在main.js里面

// 全局引入按需引入UI库 vant
import '@/plugins/vant'

3、需要使用组件的页面(swipe)

 <van-swipe :autoplay="3000">
        <van-swipe-item v-for="(image,index) in lunboList" :key="index">
          <img v-lazy="image" height="180px" width="100%"/>
        </van-swipe-item>
      </van-swipe>