微信小程序引入VANT組件的方法步驟
1.右鍵項(xiàng)目名稱(chēng)->在終端中打開(kāi)
2.在終端輸入 npm init 用來(lái)初始化，然后一直回車(chē)默認(rèn)就Ok。
之后項(xiàng)目中會(huì)出現(xiàn) project.config.json
內(nèi)容為當(dāng)前項(xiàng)目的配置信息以及依賴(lài)包的管理。
3.安裝vant依賴(lài)包(在終端輸入)
npm i vant-weapp -S --production
4.進(jìn)入小程序開(kāi)發(fā)工具，選擇左上角 工具->構(gòu)建npm
完成之后項(xiàng)目里會(huì)多出依賴(lài)包
5.點(diǎn)擊右上角詳情并勾選使用npm模塊。
6.選擇要在哪個(gè)pages里使用該組件
這里以pages下的movie舉例，寫(xiě)一個(gè)簡(jiǎn)單的按鈕。
如圖 在對(duì)應(yīng)的json文件中引入vant的button
7.在對(duì)應(yīng)wxml文件，寫(xiě)如下代碼：
<van-button type="default">默認(rèn)按鈕</van-button> <van-button type="danger">主要按鈕</van-button>
效果圖如下：
注意：若樣式?jīng)]出來(lái)，重復(fù)步驟4。
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了小程序使用分包的示例代碼，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-03-03
JS Array.slice 截取數(shù)組的實(shí)現(xiàn)方法
這篇文章主要介紹了JS Array.slice 截取數(shù)組的實(shí)現(xiàn)方法,因?yàn)槲覀冃枰刂埔幌麻L(zhǎng)度，需要的朋友可以參考下2016-01-01
這篇文章主要介紹了JavaScript AJAX之惰性載入函數(shù),惰性載入表示函數(shù)執(zhí)行的分支僅會(huì)發(fā)生1次,是種JS的優(yōu)化技巧,需要的朋友可以參考下2014-08-08
這篇文章主要介紹了JavaScript異步加載淺析,本文講解了腳本延遲執(zhí)行、腳本的完全并行化、可編程的腳本加載等內(nèi)容,需要的朋友可以參考下2014-12-12
JavaScrip實(shí)現(xiàn)一個(gè)有時(shí)間限制的緩存類(lèi)的方式
本文將探索 JavaScript 中一種基于自動(dòng)過(guò)期機(jī)制的時(shí)間限制緩存實(shí)現(xiàn)方式,提高數(shù)據(jù)緩存策略的靈活性和效率,文中通過(guò)代碼示例給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作有一定的幫助,需要的朋友可以參考下2024-01-01
js字符串截取函數(shù)substr substring slice使用對(duì)比
字符串截取函數(shù)有substr、substring以及slice等等，下面將為大家介紹下各自的使用，感興趣的朋友可以了解下2013-11-11
javascript獲得服務(wù)器端控件的ID的實(shí)現(xiàn)代碼
javascript獲得服務(wù)器端控件的ID的實(shí)現(xiàn)代碼，需要的朋友可以參考下。2011-12-12
JavaScript筆記之?dāng)?shù)據(jù)屬性和存儲(chǔ)器屬性
本文給大家介紹js數(shù)據(jù)屬性和存儲(chǔ)器屬性，及兩種屬性的區(qū)別，對(duì)js數(shù)據(jù)屬性存儲(chǔ)器屬性相關(guān)知識(shí)感興趣的朋友一起學(xué)習(xí)2016-03-03
BootStrap Progressbar 實(shí)現(xiàn)大文件上傳的進(jìn)度條的實(shí)例代碼
這篇文章主要介紹了BootStrap Progressbar 實(shí)現(xiàn)大文件上傳的進(jìn)度條的實(shí)例代碼的相關(guān)資料，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-06-06
本文主要介紹了Ajax 實(shí)現(xiàn)不刷新取最新商品的方法。具有很好的參考價(jià)值，下面跟著小編一起來(lái)看下吧2017-03-03