vant


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是時間的選擇器


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM