主机参考:VPS测评参考推荐/专注分享VPS服务器优惠信息!若您是商家可以在本站进行投稿,查看详情!此外我们还提供软文收录、PayPal代付、广告赞助等服务,查看详情! |
我们发布的部分优惠活动文章可能存在时效性,购买时建议在本站搜索商家名称可查看相关文章充分了解该商家!若非中文页面可使用Edge浏览器同步翻译!PayPal代付/收录合作 |
您可能想知道为什么在使用选择器组件时遇到渲染问题,或者只是想检索中文值。 我应该怎么办?
View层
数据为json,直接显示使用picker的步骤: 当前选择 {{school[currentSchool].valuess}}
逻辑层
page({ data: { school: [ {"isNewRecord":false,"id":"2","keyss":"school","valuess":"湖南小学"}, { "isNewRecord" : false ,"id":"3","keyss":"学校","valuess":"北京小学"} ], currentSchool: "" } handleChange(e) { console.log(e) // 如果range是对象数组的形式,这里的值为索引下标 let currentVal = e.detail.value // 中文相当于let text = this.data .school [ currentVal] .valuess console.log(' Chinese-->', text) },})
这里,我们传递一个 Object Array 类型的数组对象。 使用选取器组件时,必须清楚地区分这些字段的含义以及它们的值是如何检索的。
range-key 指示渲染时使用哪个字段来检索值。 以下未指定。 本例中,对于非常简单的数据结构
同理: school: ["Chinese", 'Math', "Music"]
无需指定 。 对于复杂的数据结构,指定字段。 微信会自动赋值。
作者:志道清宇
model:value="{{currentSchool}}" ,为什么model绑定在value之前呢?
因为微信不是双向数据绑定。 如果只写value="{{当前选择索引的下标-currentSchool}}",逻辑层的currentSchool不会改变。 data中的数据必须通过bindchange事件修改,如下:
handleChange(e) { this.setData({ currentSchool: e.detail.value }) }
使用模型的好处是,只要点击就不用进行任何赋值操作。在右上角,请注意数据 currentSchool 已更新。 点击取消不会更新data中的数据。
在handleChange中获取e.detail.value。 的值也是一个下标。 事实上,您可能需要文本文本。
与上面类似,使用索引检索源数据中的 {} 对象属性。
另一个常见的操作是修改。 如果你过滤到像 school--school ["湖南小学", "北京小学"] 这样的简单结构,你得到的 e.detail.value 将是中文的。
但是,在这个需求中,数据有两个数组:schoolFilter--Array 类型和 school--Object Array 类型。 在选择器中使用range = "{{schoolFilter}}"
要获取源数据的其他属性,需要遍历学校来获取值。
总结
如果不想写bindchange改变数据,可以使用model:
Picker开始和结束标签该标签只选择以下内容: 如果您不想过滤数据,则可以使用文本渲染、{{content}} 渲染、视图渲染和输入渲染来组织数据。
获取数据中其他字段的对象数组。 ,使用类似对象数组的结构并通过索引访问它。 无需在数据中创建两个字段。
只需在选择器中单击“确定”即可。 单击该按钮会更新选择器中的数据。
推荐教程:《微信小程序》
PHP 快速学习视频免费教程(入门到精通)
如何学习 PHP? 我应该从哪里学习 PHP? 不用担心。 这里有简单的 PHP 学习教程(从初学者到专家)。 您可以保存并下载您想学习的朋友。
下载
这几篇文章你可能也喜欢:
- 一个小而美的小程序脚手架,让您更顺利、更快速地开发小程序(app脚手架)。
- 阅读本文开始使用小程序(小程序x)
- 如何使用Canvas(微信小程序中制作海报的软件)在小程序中绘制海报
- 小程序性能优化实用技巧(小程序性能优化实用技巧有哪些?)
- 微信小程序调用微信认证窗口(微信小程序微信认证)
本文由主机参考刊发,转载请注明:小程序选择器数据是一个对象数组 https://zhujicankao.com/123889.html
评论前必须登录!
注册