今天在项目中遇到个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即可(覆盖下)。虽然问题解决了。虽然是个非常小的问题,但是不得不说一声,还是希望大家在写移动端,用这种体量较小的组件的时候尽量应用自己的组件,尽量封装一个自己的组件库。个人觉得,不出错的情况下,现成的组件一定效率很高很快,但是如果遇到未知问题,耗费的事件或许比你自己开发一个插件的时间还要长!!!他们或许很优秀,但是只有自己封装的道具,才最适合自己。
05-22