您的位置:58编程 > 微信小程序基础内容组件 微信小程序 WeUI·基础组件

微信小程序基础内容组件 微信小程序 WeUI·基础组件

2023-05-25 18:33

微信小程序基础内容组件 微信小程序 WeUI·基础组件

微信小程序基础内容组件 微信小程序 WeUI·基础组件

微信小程序基础内容组件

Badge徽章

出现在按钮、图标附近的数字或者状态标记。

示例代码:

{
  "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加载

加载数据时的 loading 效果

示例代码:

{
    "usingComponents": {
        "mp-loading": "../components/loading/loading"
    },
    "navigationBarTitleText": "UI组件库"
}

Icon

图标

代码引入

在 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>

效果展示

属性列表

属性类型默认值说明
extClassstring组件类名
typestringoutlineIcon类型,可选值 outline(描边),field(填充)
iconstringIcon名字
sizenumber20Icon的大小,单位 px
colorstringblackIcon的颜色,默认黑色

Icon 列表

 


阅读全文
以上是58编程为你收集整理的微信小程序基础内容组件 微信小程序 WeUI·基础组件全部内容。
声明:本站所有文章资源内容,如无特殊说明或标注,均为采集网络资源。如若本站内容侵犯了原著者的合法权益,可联系本站删除。
相关文章
© 2024 58编程 58biancheng.com 版权所有 联系我们
桂ICP备12005667号-32 Powered by CMS