小程序之picker 数据是 Object Array（小程序之间跳转不提示）

小程序之picker 数据是 Object Array（小程序之间跳转不提示）

我们在操作 picker 组件的时候 可能会有疑惑，为什么会出现渲染问题，或者我就是想取中文的值，怎么办？

视图层

数据是json的，直接展示picker使用说明： 当前选择 {{school[currentSchool].valuess}} -

逻辑层

page({ data: { school: [ {"isNewRecord":false,"id":"2","keyss":"school","valuess":"湖南小学"}, {"isNewRecord":false,"id":"3","keyss":"school","valuess":"北京小学"} ], currentSchool: "" } handleChange(e) { console.log(e) // 如果 range是一个 Object Array形式的，那这里的value就是索引下标 let currentVal = e.detail.value // 对应的中文是 let text = this.data.school[currentVal].valuess console.log('中文-->', text) },})-

这里，我们传入的是一个数组对象 Object Array类型， 那么我们在使用picker组件的时候，一定要分清，这些字段的意思，以及如何取值

range-key 是告诉我们，在渲染的时候，是以什么字段取值，下面就是不指定的情况，如果是很简单的数据结构

类似：school: ["中文", '数学', "音乐"]

是不需要指定的，对于复杂的数据结构，指定字段，微信会自动帮我们去赋值

程序员必备接口测试调试工具：立即使用Apipost = Postman + Swagger + Mock + Jmeter Api设计、调试、文档、自动化测试工具 后端、前端、测试，同时在线协作，内容实时同步

作者：知了清语

model:value="{{currentSchool}}" 你可能会发现这个，为什么value前面绑定了model

因为微信不是双向数据绑定的，如果单纯的写 value="{{当前选中的索引下标-currentSchool}}"

逻辑层的currentSchool 是不会有变化的，必须通过 bindchange事件去修改 data中的数据, 像下面这样

handleChange(e) { this.setData({ currentSchool: e.detail.value })}-

我们在 handleChange中的 e.detail.value 拿到的值也就是个下标，其实我们可能会想要text文本

就直接像上面那样，用索引去取源数据中的 {} 对象属性

还有一种常见的操作，就是将 school--schoolFilter变成 ["湖南小学", "北京小学"] 这种简单结构，那么e.detail.value 获取的就是中文

但是这种要求，data中有2个数组 schoolFilter--Array类型的 和school--Object Array类型的， picker中用 range = "{{schoolFilter}}"

那么要获取源数据的其他属性，就必须遍历school 再取值

总结

推荐教程：《微信小程序》

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。