我的编程空间,编程开发者的网络收藏夹
学习永远不晚

使用van-picker 动态设置当前选中项

短信预约 -IT技能 免费直播动态提醒
省份

北京

  • 北京
  • 上海
  • 天津
  • 重庆
  • 河北
  • 山东
  • 辽宁
  • 黑龙江
  • 吉林
  • 甘肃
  • 青海
  • 河南
  • 江苏
  • 湖北
  • 湖南
  • 江西
  • 浙江
  • 广东
  • 云南
  • 福建
  • 海南
  • 山西
  • 四川
  • 陕西
  • 贵州
  • 安徽
  • 广西
  • 内蒙
  • 西藏
  • 新疆
  • 宁夏
  • 兵团
手机号立即预约

请填写图片验证码后获取短信验证码

看不清楚,换张图片

免费获取短信验证码

使用van-picker 动态设置当前选中项

van-picker 动态设置当前选中项

使用vant-field和van-picker、van-popup组合实现单选类型表单时,通常我们需要pick每次显示时,默认选中的是当前有效值,但往往会出现这样的情况

我们可以在没法显示picker的时候,动态设置当前选中项,代码示例如下

//pick中指定ref属性为myPicker
//currentIndex为当前有效值对应的索引值
this.$refs.myPicker.setColumnIndex(0, currentIndex)

setColumnIndex有两个参数,第一个参数columnIndex代表的是列索引值,如果不涉及多列联动,默认为0;第二个参数optionIndex代表的要设置的有效索引值

van-picker 选择器空白问题

van-picker绑定的数据实在store里,在store里数据格式也是正确的,但是到页面里picker的选择项就是全空白,

在该路由中将该组件的keepalive设为了true,所以从别的页面回来的时候,picker绑定的数据不会重新获取,而该组件在初始的created里将picker的数据项写为了空数组,此时只需要在activated生命周期里重新给picker绑定的数据重新进行取值操作即可。

以上为个人经验,希望能给大家一个参考,也希望大家多多支持编程网。

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

使用van-picker 动态设置当前选中项

下载Word文档到电脑,方便收藏和打印~

下载Word文档

猜你喜欢

使用van-picker 动态设置当前选中项

这篇文章主要介绍了使用van-picker 动态设置当前选中项方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
2022-11-13

vue中van-picker的选项插槽的使用

这篇文章主要介绍了vue中van-picker的选项插槽的使用,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
2023-01-18

小程序开发中如何动态设置当前页面的标题

这篇“小程序开发中如何动态设置当前页面的标题”除了程序员外大部分人都不太理解,今天小编为了让大家更加理解“小程序开发中如何动态设置当前页面的标题”,给大家总结了以下内容,具有一定借鉴价值,内容详细步骤清晰,细节处理妥当,希望大家通过这篇文章
2023-06-26

微信小程序开发中如何动态设置当前页面的标题

这篇“微信小程序开发中如何动态设置当前页面的标题”文章,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要参考一下,对于“微信小程序开发中如何动态设置当前页面的标题”,小编整理了以下知识点,请大家跟着小编的步伐一步一步的
2023-06-26

windows hello人脸识别设置不了此选项当前不可用如何解决

这篇文章主要讲解了“windows hello人脸识别设置不了此选项当前不可用如何解决”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“windows hello人脸识别设置不了此选项当前不可用
2023-07-04

Xamarin XAML语言中如何使用Progress属性设置当前进度

小编给大家分享一下Xamarin XAML语言中如何使用Progress属性设置当前进度,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!Xamarin XAML语言
2023-06-04

Xamarin XAML语言中如何使用属性设置进度条的当前进度

这篇文章主要为大家展示了“Xamarin XAML语言中如何使用属性设置进度条的当前进度”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“Xamarin XAML语言中如何使用属性设置进度条的当前进
2023-06-04
SQLServer 错误 41359 当数据库选项 READ_COMMITTED_SNAPSHOT 设置为 ON 时,使用 COMMITTED 隔离级别访问内存优化表的查询不能访问基于磁盘的表。 使用
2023-11-05

编程热搜

目录