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

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

一、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;
  }
}

经过测试问题成功解决。

五、欢迎交流指正,关注我,一起学习。

相关文章
|
8天前
|
小程序 UED 开发者
小程序如何监听页面的滚动事件
小程序如何监听页面的滚动事件
39 0
|
8天前
|
小程序 JavaScript
小程序自定义弹窗禁止底部内容滚动(滚动穿透问题)
小程序自定义弹窗禁止底部内容滚动(滚动穿透问题)
105 0
|
6月前
|
小程序 前端开发 容器
微信小程序隐藏右侧滚动条并可以滚动
微信小程序隐藏右侧滚动条并可以滚动
203 0
|
8月前
|
小程序
小程序滚动时使标题背景颜色改变
小程序滚动时使标题背景颜色改变
66 0
|
8天前
|
小程序
微信小程序scroll-view横向滚动和纵向滚动实现(亲测管用)
微信小程序scroll-view横向滚动和纵向滚动实现(亲测管用)
|
6月前
|
JSON 小程序 前端开发
微信小程序picker选择器渲染json数据
微信小程序picker选择器渲染json数据
44 0
|
6月前
|
小程序 开发工具 开发者
微信小程序日期选择器显示当前系统年月日时分
微信小程序日期选择器显示当前系统年月日时分
107 0
|
6月前
|
小程序 JavaScript 前端开发
picker选择器(下拉框)以及传值问题
微信小程序picker选择器(下拉框)以及传值问题
46 0
|
6月前
|
JSON 小程序 JavaScript
微信小程序-vant-weapp日期选择器的使用(年月日时分)
微信小程序-vant-weapp日期选择器的使用(年月日时分)
165 0
|
9月前
|
小程序 JavaScript
微信小程序-监听屏幕滚动
微信小程序-监听屏幕滚动
179 0

热门文章

最新文章