其實(shí)與element的寫法大致相同,首先我們需要先下載依賴。
npm i vant@latest-v2 -S
然后,在main.js中引入
import Vant from 'vant'; import 'vant/lib/index.css'; Vue.use(Vant);
然后,我們就能正常使用vant了,要注意的是,vue2使用vant2,而vue3使用vunt3版本。
接下來,我們看一個(gè)例子,我們這邊要使用時(shí)間選擇器和底部彈出框來展示一個(gè)選擇時(shí)間的組件。因?yàn)橹苯语@示選擇時(shí)間的組件會(huì)很難看,所以我們加上彈出框的白色 底部來突出這個(gè)時(shí)間選擇器。
其中van-popup是底部彈出框,而van-datetime-picker是時(shí)間選擇器。
以下就是我們顯示出的效果了。