<view class="container">
<picker-view indicator-style="height: 50px;" style="width: 100%; height: 200px;" value="{{multiIndex}}" bindchange="bindMultiPickerChange">
<picker-view-column>
{{multiArray[0]}}
</picker-view-column>
<picker-view-column>
{{multiArray[1]}}
</picker-view-column>
<picker-view-column>
{{multiArray[2]}}
</picker-view-column>
</picker-view>
</view>
在对应的 .js 文件中,你需要定义 multiArray、multiIndex 和 bindMultiPickerChange:
Page({
data: {
multiArray: [['选项1', '选项2', '选项3'], ['子选项1', '子选项2', '子选项3'], ['子子选项1', '子子选项2', '子子选项3']],
multiIndex: [0, 0, 0],
},
bindMultiPickerChange: function (e) {
this.setData({
multiIndex: e.detail.value,
});
},
});
在这个示例中,multiArray 是一个二维数组,分别表示 picker-view 的三个列。multiIndex 表示当前选择的项的索引。
你可以根据实际需求修改 multiArray 和处理选择变化的函数 bindMultiPickerChange。这个组件的灵活性允许你创建多种多样的滚动选择器。
转载请注明出处:http://www.zyzy.cn/article/detail/807/微信小程序