vant的特性:
- 60+ 高質量組件
- 95% 單元測試覆蓋率
- 完善的中英文文檔和示例
- 支持按需引入
- 支持主題定制
- 支持國際化
- 支持 TS
- 支持 SSR
vant 在 vue中引入
# 通過 npm 安裝 npm i vant -S
在main.js引入
import Vant from 'vant';
import 'vant/lib/index.css';
Vue.use(Vant);
vant主要是vue中的移動端
下面我們來演示一下在vue移動端中點擊按鈕顯示遮罩層 在遮罩層中顯示DatetimePicker 時間選擇
如圖所示
在temolate中寫入button按鈕並設置點擊事件
遮罩層中寫入DatetimePicker 時間選擇
v-show顯示與隱藏
position定位於底部bottom
type屬性是時間的年月
formatter是選項格式化函數
!!!應該駝峰命名 sorry~!!!!
confirm是確認按鈕que是點擊事件
cancel是取消按鈕del是點擊事件
點擊取消時隱藏遮罩層
點擊按鈕時顯示遮罩層
formatter是時間的選擇器