(uni-app)picker-view中@change触发太慢

已于 2023-12-21 16:58:08 修改
阅读量667 收藏 9
点赞数 7
文章标签： vue.js uni-app 小程序
于 2023-12-21 16:46:33 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/gusensen/article/details/134641548
版权 
<picker-view immediate-change="true":value="value" @change="onConfirm" class="picker-view">
	<picker-view-column></picker-view-column>
</picker-view>

在使用uni-app开发的小程序进行选项选择是，会出现划过去，点击了确定（但是数值没有直接拿到）
这是由于在前代版本picker-view的@change方法会在滑动结束后才触发，如果我随手一滑，还没等他停下就就按确定按钮，那么@change没触发就不能获取到滑动后改变的值
现在官方修复了这个BUG
picker-view增加了immediate-change方法，设置成true。
（是否在手指松开时立即触发 change 事件。若不开启则会在滚动动画结束后触发 change 事件）
--------------------------17年的BUG，真是古老啊。（迟来的修复）

星河顾盼
关注
  • 7
    点赞
  • 踩
  • 9
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
微信小程序-picker-view 设置value值时触发bindchange事件
desongzhang的博客
04-06 2637
做一个联动的日期滚动组件时，用微信小程序的原生picker-view（本来想用vant，但是有个滚动回弹的bug）在bindChange事件中设置value会再次触发bindChange事件，造成页面滚动，可以加一个开关： if (this.data.isSlide) { this.setDefTime(val1, val2); } if (this.data.isSlide) { this.setData({ val
uni-app uni-data-picker 省市区数据表
06-16
<uni-data-picker> 是一个选择类datacom组件。支持多列级联选择。列数没有限制，如果屏幕显示不全，顶部tab区域会左右滚动。 适用于uni-app使用uni-data-picker实现省市区选择器的json数据
uniapp 改写uni-data-picker级联选择器（带搜索和多选）新增列出选择和删除功能
qq_36958916的博客
07-09 1万+
uniapp 改写uni-data-picker级联选择器（带搜索和多选）新增列出选择和删除功能
uniapp关于uview-ui中u-picker（picker-view）快速滚动点击确定无效的问题
qq_40358970的博客
07-20 1529
在uniapp中的picker-view有集成两种事件：@pickstart和@pickend ， 用来监听滚动事件的；首先我们要知道，uview-ui中的u-picker底层也是使用uniapp中集成的picker-view。带着这个问题，只需要在监听到滚动结束后才能触发成功确定按钮才行；由于滚动动画有延迟效果导致的；
微信小程序picker组件遇到的问题与解决方案
书写人生
01-17 1万+
一、picker基本概念 当然先看官方文档 picker说明搞清楚基本概念 “从底部弹起的滚动选择器，现支持三种选择器，通过mode来区分，分别是普通选择器，时间选择器，日期选择器，默认是普通选择器。” 几个主要属性： range： 选取范围，数据类型为Array / Object Array，mode为 普通选择器 时，range 有效； value： value 的值表示选择了
uniapp picker @change不触发
李世铭的博客
06-05 3808
使用uniapp的 picker 组件。按照文档：picker - uni-app官网 (dcloud.io)无论如何@change不触发
uview中Picker选择器 点击页面数据延迟问题
cwb_2120的博客
03-23 1578
在uniapp开发中，很多用户都使用到了uview这个组件，当然开发小程序之类的，我们经常会使用到Picker 选择器，用的过程中很容易发现这个组件有一个坑就是，点击页面的时候，数据会延迟，刚开始我还是以为是数据层级过深导致页面不刷新，使用了this.$forceUpdate()之后，发现还是不行，结果我发现只需要在Picker组件上加上一个属性就好了。，这样就可以实时监听到数据的变化。
【uni-app】picker-view选择器快速滚动并确认时取值错误
04-10 2888
在picker内容还在滚动时或滚动回弹动画还未结束时，点确定关闭弹出的picker，数据无法及时更新。需等待一下，或手动触停滚动再点确定。所有平台均如此 我们只需要在picker-view标签上加上两源生方法@pickstart @pickend 注意：小程序最低基础库要求2.3.1 在pickstart 时，将是否可点击确认按钮设置为false，直到触发了pickend时，改变状态为 true，则可以点击确认，触发完成事件 <template> <picke..
Uniapp 微信小程序@click点击事件失效
qq_51574759的博客
08-26 1万+
我在一个页面上做了一个遮罩层，遮罩层上面绑定了点击事件，有一些能被点击，但是有一些还是失效了。层级遮盖的问题，但其实，就算遮罩层明显可见，遮罩在页面上方，当页面和遮罩层都默认保持同一个。，有时候虽然本地测试是好的，但是也不能保证在所有分辨率不同的屏幕上没有BUG。的时候，可能因为隐藏的遮盖效，而导致触发点击处被遮盖，导致无法点击。所以建议，当需要在遮罩层上设置点击事件的时候，不要偷懒，手动设定。因为遮罩层明显可见，所以我就没有考虑是。之类的方法，还有可能有一个错误。...
iOS开发，pickerView滚动完成，防止选择不准确
wangletiancsdn的博客
05-20 1580
pickerView滚动停止的时候才能点击确定，滚动过程和滚动减速不能点击确定按钮，否则选择数据不准确。我是在做地址选择的时候发现这个问题，我们只需要循环遍历pickerView的子view是否正在拖拽或者滚动就可以了。 话不多说，直接贴代码了 - (BOOL)anySubViewScrolling:(UIView *)view{ if ([view isKindOfClass:[U...
很好用的uni-app节点树组件！
06-23
很好用的uni-app节点树组件！
基于picker-view的日期选择器
最新发布
03-22
基于picker-view的日期选择器，只有年月日选择，uni-app自带的组件不适合利用按钮触发调用，该组件可用在uni-popup里，点击按钮获取
uni-app实现省市区三级联动的js文件
10-22
本文件是uni-app实现省市区三级联动中的data.js文件，详情见博客：https://whhtjl.blog.csdn.net/article/details/109216246
el-date-picker 英文改中文.doc
11-18
https://blog.csdn.net/xuelang532777032/article/details/121287203,内有博客截图，方便没有vip的小伙伴下载
小程序：picker-view选择器快速滚动，确认时，”值显示错误“
snowball的博客
07-15 2807
点击确定，关闭弹出的picker，数据无法及时更新，需等待一下，或手动触停滚动再点确定。滑动到某一个角色，点击确定，页面的数据没有更新，停留在之前的一个选项。picker内容还在滚动时或滚动回弹动画还未结束时，嵌入页面的滚动选择器。组件，其它节点不会显示。技术选型uniapp。...
Android-PickerView系列之介绍与使用篇（一）
热门推荐
小嵩的博客
02-27 8万+
声明：本文为博主原创文章，转载请注明出处：小嵩的博客 一、介绍 Android-PickerView是一款仿iOS的PickerView控件，并封装了时间选择和选项选择这两种选择器，详细特性如下： WheelView —— 基础控件 带有3D圆弧效果。 支持文字、颜色、大小设置。 支持背景颜色设置。 支持item的分隔线设置。 支持item间距设置。 支持设置是否循环。 ...
uniapp中picker选择器滚动时确认关闭导致数据无法及时更新解决方案picker-view
刻痕
01-13 2701
uniapp在picker内容还在滚动时或滚动回弹动画还未结束时，点确定关闭弹出的picker，数据无法及时更新解决方案picker-view
picker-view 小程序端value值不生效
qq_61474921的博客
07-08 1019
解决方法：在data(){return{ }} 之前把所需要数据准备好。网上找了一些没认真看 有兴趣自己去看吧。修改成功后代码：日期选择组件。
uniapp默认picker无法选择第一个
SSD1397713787的博客
11-02 236
【代码】uniapp默认picker无法选择第一个。
<picker-view> <picker-view-column></picker-view-column> </picker-view>
07-14
你使用了 `<picker-view>` 和 `<picker-view-column>` 组件来创建一个滚动选择器。 `<picker-view>` 是滚动选择器的容器，而 `<picker-view-column>` 则定义了滚动选择器的列。 通过以上代码片段，你创建了一个包含一个列的滚动选择器。然而，代码中的 `<picker-view-column>` 组件是空的，需要添加选项供用户选择。以下是一个示例，展示如何为滚动选择器添加选项： ```html <picker-view> <picker-view-column> <view>选项1</view> <view>选项2</view> <view>选项3</view> </picker-view-column> </picker-view> ``` 在上面的代码中，我们在 `<picker-view-column>` 组件内添加了三个 `<view>` 元素作为选项。你可以根据自己的需求添加更多选项。 请注意，滚动选择器可以包含多个列，通过多个 `<picker-view-column>` 来定义。每个 `<picker-view-column>` 组件内可以添加多个选项。 希望这能帮助到你！如果还有其他问题，请随时提问。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值