WeUI元件庫簡介

這是一套基於樣式庫weui-wxss開發的小程式擴充套件元件庫，同微信原生視覺體驗一致的UI元件庫，由微信官方設計團隊和小程式團隊為微信小程式量身設計，令使用者的使用感知更加統一。

1. 引入元件

推薦方式1， 可以省略後面import方式

• 方法1： 可以在app.json中通過引入擴充套件庫的方式

{
  "useExtendedLib": {
    "weui": true
  }
}

• 方法2： 通過npm下載構建，npm包名為 weui-miniprogram

2. 使用方法

如果是方式1 引入的，不用什麼操作

如果是方式2 引入的， 首先要在 app.wxss

@import '/miniprogram_npm/weui-miniprogram/weui-wxss/dist/style/weui.wxss';

然後可以在任何頁面的json檔案中加入要使用的元件庫

{
  "usingComponents": {
    "mp-dialog": "/miniprogram_npm/weui-miniprogram/dialog/dialog"
  }
}

最後就可以在頁面的wxml中直接使用該元件

<mp-dialog title="test" show="{{true}}" bindbuttontap="tapDialogButton" buttons="{{[{text: '取消'}, {text: '確認'}]}}">
    <view>test content</view>
</mp-dialog>

3. 其他元件的效果可以掃描觀看