@retailwe/ui-order-group NPM

order-group 订单分类

引入

全局引入，在miniprogram根目录下的app.json中配置，局部引入，在需要引入的页面或组件的index.json中配置。

// app.json 或 index.json
"usingComponents": {
  "wr-order-group": "@retailwe/order-group/index"
}

代码演示

基础用法

<wr-order-group orderTagInfos="{{orderTagInfos1}}" bind:click="onClick" bind:clickTop="onClickTop" />

Page({
  data: {
    orderTagInfos: [
         {
           title: '待付款',
           iconName: 'wallet',
         },
         {
           title: '待发货',
           iconName: 'wuliu-1',
         },
         {
           title: '待收货',
           iconName: 'packaging',
         },
         {
           title: '退款/售后',
           iconName: 'money',
         },
       ],
  },
  onClick(e) {
    console.log('onClick', e);
  },
  onClickTop() {
    console.log('onClickTop');
  },
});

API

order-group Props

参数	说明	类型	默认值	版本
title	top标题	string	`我的订单`	-
value	top右侧展示文字	string	`全部订单`	-
isTop	是否显示top	boolean	`true`	-
orderTagInfos	订单分类数据源，最多设置四个分类	array	[]	-

orderTagInfos Props

参数	说明	类型	默认值	版本
title	分类标题	string	-	-
iconName	分类图标icon	string	-	-
orderNum	角标展示的数量，如果不设置或参数是0则不展示	number	-	-
dot	角标是否展示为小点，配合orderNum参数使用	boolean	`false`	-
...	其他参数	any

order-group Event

事件名	说明	参数
click	点击单元格时触发	-
clickTop	点击单元格时触发	-

@everything-registry/sub-chunk-778 @zalastax/nolb-_ret

4 years ago

4 years ago

4 years ago

4 years ago