P3コンポーネントライブラリ_3.VantWeappのインストールと使用

P3コンポーネントライブラリ_3.VantWeappのインストールと使用

 

https://youzan.github.io/vant-weapp/#/quickstart

 

 

コマンドラインを開く 

以前にインストールされていることに注意してください。

nodejsがインストールされていない場合

nodejsについてのBaidu 

インストール

 

注意:

インストール

 

生成:

 

この時点でインストールします

npm i @vant/weapp -S --production

 

 

開発ツールをチェックインする

 

次にnpmをビルドします 

 

正常に構築されました

 

 

 

app.jsonの "style": "v2" 削除

追加

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

 

エラー:

[ WXML 文件编译错误] ./miniprogram_npm/@vant/weapp/action-sheet/index.wxml
../wxs/utils.wxs not found from ./miniprogram_npm/@vant/weapp/action-sheet/index.wxml
> 1 | <wxs src="../wxs/utils.wxs" module="utils" />
    | ^
  2 | 
  3 | <van-popup
  4 |   show="{
   
   { show }}"
at files://miniprogram\miniprogram_npm\@vant\weapp\action-sheet\index.wxml#1

 

ボタン効果が出ます

 

ボタンにアイコンを追加する

 

<van-button type="info" icon="star-o">主要按钮</van-button>

 

===========効果を発揮する

<van-button bindtap="onClick" type="info" icon="gem">主要按钮</van-button>

 

 

 

 

 

 

おすすめ

転載: blog.csdn.net/huanglianggu/article/details/107443532