微信小程序添加Vant Weapp組件庫


首先右鍵小程序代碼中的miniprogram文件夾---->在終端中打開

輸入:npm init

之后一直回車選擇默認就行

在miniprogram文件夾中自動生成了package.json文件

之后同樣在終端執行:npm i @vant/weapp -S --production

回到小程序開發工具----->菜單‘工具’----->‘構建npm’

構建后會發現在miniprogram文件夾下會有個miniprogram_npm文件夾,里面存放vant組件庫

在開發工具最右邊----->詳情------->本地設置------->勾選‘使用npm模塊’

之后就可以開始使用vant組件庫了

例:

引入button組件庫,可以參考官網:https://youzan.github.io/vant-weapp/#/intro

找到相應的組件庫說明;

首先:

引入

在需要使用的頁面中的 .json文件里添加:

"usingComponents": { "van-button": "@vant/weapp/button" }

之后再 .wxml中添加:

<van-button type="primary">主要按鈕</van-button>
搞定


免責聲明!

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



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