picker组件的mode = multiSelector多列选择器
代码:小程序官方提供的案例
<view class="section">
<view class="section__title">多列选择器</view>
<picker mode="multiSelector" bindchange="bindMultiPickerChange" bindcolumnchange="bindMultiPickerColumnChange" value="{{multiIndex}}" range="{{multiArray}}">
<view class="picker">
当前选择:{{multiArray[0][multiIndex[0]]}},{{multiArray[1][multiIndex[1]]}},{{multiArray[2][multiIndex[2]]}} </view>
</picker></view>
当picker组件滚动后,点击取消,当前选择也发生了变化;
期望: 点击取消后,当前选择不应该变化吧,可不可以加一个点击取消的事件
试试 bindcancel
mode = multiSelector 做省市区的时候,range的值需要动态更改,展示的值也会页面会随着动态更改,点击取消在返回原来的值吗? 希望能做到,选择省市的时候,只有弹层的数据更改,页面的值只有点击确定的时候再更改
*仔细看下bindchange和bindcolumnchange的定义,组件没有问题只是demo写的有点瑕疵*
导致这个问题的原因是显示和滚轮选择用的是一个变量,所以选择即改变了,跟取消没有关系,自己存一个显示的变量,点击“确定”触发bindchange的时候赋值显示的变量就行了...
希望能够解决下
遇到一样的问题,声明多一个变量可解决。最终根据这个变量取值即可
multiIndex: [0, 0, 0],
actualIndex: [0, 0, 0]
<
picker
mode
=
"multiSelector"
bindtap
=
"bindPickerTap"
bindchange
=
"bindMultiPickerChange"
bindcolumnchange
=
"bindMultiPickerColumnChange"
value
=
"{{multiIndex}}"
range
=
"{{multiArray}}"
>
<
view
class
=
"picker"
>
当前选择:{{multiArray[0][actualIndex[0]]}},{{multiArray[1][actualIndex[1]]}},{{multiArray[2][actualIndex[2]]}}
</
view
>
</
picker
>
bindMultiPickerChange:
function
(e) {
console.log(
'picker发送选择改变,携带值为'
, e.detail.value)
this
.setData({
multiIndex: e.detail.value,
actualIndex: e.detail.value
})
}
//选中项重置为取消以前的值,但是有过渡效果,当然不重置也行
bindPickerTap:
function
(e) {
this
.setData({
multiIndex: this.data.actualIndex
})
}
2020年过来 依然无人解决。搞不懂这什么逻辑啊。取消也变动
后来怎么解决的?
希望,官方 mode = multiSelector 取消按键 可以隐藏 功能
bindcancel试了没用,希望官方可以跟进下这个问题,谢谢