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组件滚动后，点击取消，当前选择也发生了变化；

期望：点击取消后，当前选择不应该变化吧，可不可以加一个点击取消的事件

5 回复

xia011 楼6 年前

遇到一样的问题，声明多一个变量可解决。最终根据这个变量取值即可

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

})

}

yaoqiang2 楼6 年前

试试 bindcancel

mhan3 楼6 年前

希望能够解决下

yang504 楼6 年前

希望，官方 mode = multiSelector 取消按键可以隐藏功能

chaosun5 楼4 年前

bindcancel试了没用，希望官方可以跟进下这个问题，谢谢