遇到多选择项的时候，Taro-Picker组件如何使用？

JavaScript014

遇到多选择项的时候，Taro-Picker组件如何使用？,第1张

用框架做项目可以事半功倍，它封装好的各种功能免去你很大部分的工作。taro+taroui可以很好的实现开发一次，多端运行为目的的小程序。 Taro UI - Picker 选择器是从底部弹起的滚动选择器，从官网给出的示例来看，通过onChange可以改变值，state的数据储存也是很简单的 state={selector:['美国','中国','巴西','日本']} 但是做项目的时候，数据的结构不可能那么简单，有时候是多层嵌套+多个条件选择，比如： options数组里有3个对象，即要渲染出3个Picker选择器。 在当前js中，是无法在循环条件下渲染出来选择器的，就onChange触发的函数来说，就没法监听是由哪个对象改变的。 其实解决办法很简单，将选择器抽取出来为组件，父页面循环数组给子组件传递单个对象，这样渲染出来的每个选择器都是相互独立的，内调的onChange方法在子组件内部监听，也不会影响其他选项。

组件说明：

picker：

滚动选择器，现支持三种选择器，通过mode属性来区分，分别是普通选择器(mode = selector)，时间选择器(mode = time)，日期选择器(mode = date)，默认是普通选择器。