小程序:picker-view选择器快速滚动,确认时,“值显示错误”

滑动到某一个角色,点击确定,页面的数据没有更新,停留在之前的一个选项。

image.png

找到原因:

picker内容还在滚动时或滚动回弹动画还未结束时,
点击确定,关闭弹出的picker,数据无法及时更新,需等待一下,或手动触停滚动再点确定。
解决问题:

bindpickstart bindpickend

<picker-view :indicator-style="itemHeight" bindpickstart="pickstart" bindpickend ="pickend" :value="pickVal" bindchange="bindChange">
    <picker-view-column>
        <view class="w-picker-item" v-for="(item,index) in data" :key="index">{{item.label}}</view>
    </picker-view-column>
</picker-view>
// 定义标记变量 isMoving 
pickstart() {
    this.isMoving = true;
},
pickend() {
    this.isMoving = false;
},
pickerConfirm(e){
    if (this.isMoving) {
        console.log('运动中,不能点击哦')
        return;
    }
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容