微信小程序 WeUI·基礎(chǔ)組件

Badge徽章

出現(xiàn)在按鈕、圖標(biāo)附近的數(shù)字或者狀態(tài)標(biāo)記。

示例代碼：

{
  "usingComponents": {
    "mp-cells": "../components/cells/cells",
    "mp-cell": "../components/cell/cell",
    "mp-badge": "../components/badge/badge"
  }
}

Gallery畫廊

用于多張圖片展示，類似原生的wx.previewImage的展示。

示例代碼：

{
  "usingComponents": {
    "mp-gallery": "../components/gallery/gallery"
  }
}

Loading加載

加載數(shù)據(jù)時的 loading 效果

示例代碼：

{
    "usingComponents": {
        "mp-loading": "../components/loading/loading"
    },
    "navigationBarTitleText": "UI組件庫"
}

Icon

圖標(biāo)

代碼引入

在 page.json 中引入組件

{
  "usingComponents": {
    "mp-icon": "../../components/icon/icon"
  }
}

示例代碼

<!--WXML示例代碼-->
<mp-icon type="field" icon="add" color="black" size="{{25}}"></mp-icon>
<mp-icon icon="add" color="black" size="{{25}}"></mp-icon>

效果展示

屬性列表

Icon 列表