【微信小程序】多选Picker组件
先贴效果图
Gitee地址:https://gitee.com/x587/wp-combobox
使用方法:
在需要引入此组件的page中的iindex.json中加入以下内容
"usingComponents": {
"combobox": "../../components/combobox/combobox"
}
index.wxml中
参数及事件说明
| 参数名 | 是否必填 | 属性 | 默认值 | 说明 |
|:-----------: |:--------: |:------: |:----------: |:--------------: |
| values | Yes | Array | | 待选菜单中的值 |
| placeholder | No | String | 添加新标签 | 输入框的提示符 |
| 事件名 | 说明 | detail |
|:-----------: |:---------------------------------: | :--------------------------------: |
| add | 当用户在输入框新建tag时触发 | target:当前新建的tag, |
| | | value:当前已经选中的tag |
| repeatvalue | 当用户在输入框新建已经存在的时触发 | value:当前输入的重复的tag |
| delete | 当用户删除添加的tag时触发 | target:当前删除的tag, |
| | | value:当前已经选中的tag |
| sure | 当用户点击确认按钮时触发 | value:当前已经选中的tag |
| cancel | 当用户点击取消按钮时触发 | value:当前已经选中的tag |
Tips:由于阴影会超出页面范围,为防止出现滚动条,可以在使用的Page的样式文件中加入
page {
overflow: hidden;
}