Filter 用作标签卡筛选。
filter
属性名 |
描述 |
类型 |
默认值 |
必选 |
show |
是否显示 可选值 show hide |
String |
hide |
false |
max |
可选数量最大值,1 为单选 |
Number |
10000 |
false |
onChange |
多选时提交选中回调 |
(e: Object) => void |
- |
false |
filter-item
属性名 |
描述 |
类型 |
默认值 |
必选 |
className |
自定义样式 |
String |
- |
false |
value |
值 |
String |
- |
true |
id |
自定义标识符 |
String |
- |
false |
selected |
默认选中 |
Boolean |
false |
false |
onChange |
单选时提交选中回调 |
(e: Object) => void |
- |
false |
代码示例
{
"defaultTitle": "小程序AntUI组件库",
"usingComponents": {
"filter": "mini-antui/es/filter/index",
"filter-item": "mini-antui/es/filter/filter-item/index"
}
}
<filter show="{{show}}" max="{{5}}" onChange="handleCallBack">
<block a:for="{{items}}">
<filter-item value="{{item.value}}" id="{{item.id}}" selected="{{item.selected}}"/>
</block>
</filter>
Page({
data: {
show: true,
items: [
{ id: 1, value: '衣服', selected: true },
{ id: 1, value: '橱柜' },
{ id: 1, value: '衣架' },
{ id: 3, value: '数码产品' },
{ id: 4, value: '防盗门' },
{ id: 5, value: '椅子' },
{ id: 7, value: '显示器' },
{ id: 6, value: '某最新款电子产品' },
{ id: 8, value: '某某牌电视游戏底座' },
]
},
handleCallBack(data) {
my.alert({
content: data
});
},
toggleFilter() {
this.setData({
show: !this.data.show,
});
}
});
在文档使用中是否遇到以下问题
更多建议
匿名提交