vant van-picker 踩坑,无论如何选择都是第一条。。。

作者在项目中遇到vant-picker组件的值选择问题,发现由于所有数据的buid相同导致组件无法正确识别。他借此经验强调在使用现成组件时,尽管它们高效,但自定义封装组件在遇到问题时能节省更多时间。
摘要由CSDN通过智能技术生成


今天在项目中遇到个bug,真的很久没有在这么小的事情上翻过船了所以真的很像记录一下让自己长长记性。。。我们都知道vant 的van-picker 在设置值的时候要使用
columns-field-names属性。如下图例。


上述代码中可以看出,我chooseType方法中,我所绑定的label为 orgFullName ,获取的值为 buid。但是当我调试完毕在选择数据时,却发现永远都是选择第一条数据,这让我非常费解。在反复查看文档后,依旧无果。于是乎,我选择了最粗暴的处理方式,直接用文档中的测试数据写死。


居然是可以的!这让我感到异常疑惑。毕竟我的整体数据字段是没问题的并且也显示了,而且也是用columns-field-names,设置了我的字段。那这到底是为什么呢。后来经过仔细观看接口返回的数据我才知道。原来我返回的所有数据的buid都是一样的。这一点不得不说,确实马虎了。但是不禁让我有了另一个疑惑。组件封装的情况下,我选择的时候难道不是获取当前的item吗,难道还会根据所选中的value去遍历原始数据,拿到对应的item么?那也就是按照需求逻辑,如果我选择的一条数据,有两个值,name和value,如果value相同但是参数name不相同,那也就是不能使用咱们得组件了吗???带着这个疑问我去看了源码。翻了很久过后,发现还真是。。。 所以最后你只能放弃真正的value,最后找一个“唯一值”当做query的value。如下


然后我们在chooseType的回调方法中选择之后,在强行把query的值付给query即可(覆盖下)。虽然问题解决了。虽然是个非常小的问题,但是不得不说一声,还是希望大家在写移动端,用这种体量较小的组件的时候尽量应用自己的组件,尽量封装一个自己的组件库。个人觉得,不出错的情况下,现成的组件一定效率很高很快,但是如果遇到未知问题,耗费的事件或许比你自己开发一个插件的时间还要长!!!他们或许很优秀,但是只有自己封装的道具,才最适合自己。





 

  • 3
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值