微信小程序picker组件中如何绑定objectArray数据类型
这篇文章主要为大家展示了“微信小程序picker组件中如何绑定objectArray数据类型”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“微信小程序picker组件中如何绑定objectArray数据类型”这篇文章吧。
成都创新互联公司是专业的织金网站建设公司,织金接单;提供成都网站设计、成都做网站,网页设计,网站设计,建网站,PHP网站建设等专业做网站服务;采用PHP框架,可快速的进行织金网站开发网页制作和功能扩展;专业做搜索引擎喜爱的网站,专业的做网站团队,希望更多企业前来合作!
介绍:
普通选择器:mode = selector
属性名 | 类型 | 默认值 | 说明 | |
---|---|---|---|---|
range | Array / Object Array | [] | mode为 selector 或 multiSelector 时,range 有效 | |
range-key | String | 当 range 是一个 Object Array 时,通过 range-key 来指定 Object 中 key 的值作为选择器显示内容 | ||
value | Number | 0 | value 的值表示选择了 range 中的第几个(下标从 0 开始) | |
bindchange | EventHandle | value 改变时触发 change 事件,event.detail = {value: value} | ||
disabled | Boolean | false | 是否禁用 |
首先我的数据格式是:[{ name: '服务质量', id: 20 }, { name: '服务品质', id: 24 }, { name: '服务速度', id: 25}]
.wxml页代码:
//其中range为数据源,value为下标索引,bindchange为change改变事件{{type[index].name}}
.js代码:
/** * 页面的初始数据 */ data: { type: [{ name: '服务质量', id: 20 }, { name: '服务品质', id: 24 }, { name: '服务速度', id: 25}], index: 0,//索引 }, Change: function (e) { console.log('picker发送选择改变,索引值为', e.detail.value) console.log("选中的id值:"+e.target.dataset.id) console.log(e); this.setData({ index: e.detail.value }) }
页面效果和输出结果:
以上是“微信小程序picker组件中如何绑定objectArray数据类型”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注创新互联行业资讯频道!
文章名称:微信小程序picker组件中如何绑定objectArray数据类型
文章起源:http://azwzsj.com/article/ggjssj.html