一、picker-view简介
嵌入页面的滚动选择器。其中只可放置 picker-view-column组件,其它节点不会显示。
二、问题描述:
技术选型:uniapp。
这里做选择的时候,
滑动到某一个角色,点击确定,页面的数据没有更新,停留在之前的一个选项。
三、找到原因:
picker内容还在滚动时或滚动回弹动画还未结束时,
点击确定,关闭弹出的picker,数据无法及时更新,需等待一下,或手动触停滚动再点确定。
四、解决问题:
@pickstart="pickstart" @pickend="pickend"
<view class="w-picker-view" v-if="mode=='selector'"> <picker-view :indicator-style="itemHeight" @pickstart="pickstart" @pickend="pickend" :value="pickVal" @change="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> </view>
// 定义标记变量 isMoving pickstart() { this.isMoving = true; }, pickend() { this.isMoving = false; }, pickerConfirm(e){ if (this.isMoving) { console.log('运动中,不能点击哦') return; } }
经过测试问题成功解决。
五、欢迎交流指正,关注我,一起学习。