微信小程序选择器picker的range和range-key的用法

微信小程序选择器picker的range和range-key的用法

概述
最近在学习微信小程序中发现,官网中对选择器picker控件的range存放的是对象数组objectArray的用法描述的不是很详细,经过一番研究对picker控件的rangerange-key的用法简单坐下总结,以供参考。
pickerrangerange-key的用法

这里只是对range中存放对象数组objectArray的讲解,至于range中存放数组array的情况官网API给的非常详细在这里我就不过多描述了,想了解的请参考https://developers.weixin.qq.com/miniprogram/dev/component/picker.html

微信小程序选择器picker的range和range-key的用法

1、在js文件中定义对象数组和下标

微信小程序选择器picker的range和range-key的用法

2、获取数据放在定义的数组里面,请求的方法是我自己封装的大家可以参考 https://blog.csdn.net/DJxyyy/article/details/109187775

微信小程序选择器picker的range和range-key的用法

返回数据结构如下

微信小程序选择器picker的range和range-key的用法

3、当我们的选择bindChnage事件 来改变我们的下标

微信小程序选择器picker的range和range-key的用法

4、:在wxml中指定range和range-key

微信小程序选择器picker的range和range-key的用法

总结

到此相信大家都已经明白了picker的range和range-key的用法,简单总结一下picker的range中存放的是objectArray时需要通过range-key去指定选择器中显示的内容,否则通过数组下标取出的是一个object对象。