UI框架采用了iview,用的select组件的自动补全功能,也就是select组件的远程搜索功能
问题描述:第一次输入查询关键字,匹配到一条数据,选中后,再次输入查询关键字,如果和上次匹配到的条数length相同,选中时候结果发现匹配到的结果还是上一条的,并没有刷新。
解决过程:很是郁闷。断断续续弄了一周,猜想各种可能性,还在项目里的node_modules文件夹iview的源码里写console,但是都没有输出任何信息,打的断点也不起作用,我一直以为是无法调试,困扰了许久,偶然间,居然发现在浏览器里是可以调试的,

原来藏在这里,被自己蠢哭了!!!
可以调试后,找问题就简单了许多,这次最大的收获就是发现了怎么调试node_modules下模块的代码。
看了源码,发现只有在this.$on("append"),this.$on("remove")的时候才会触发下拉列表的刷新。所以当根据关键字查询获得的下拉列表条数和上次的相等时候,常常会不刷新。
所以我手动在每次请求后端数据之前,先将select的list置为空。


就可以了。

使用iview UI框架的select组件进行远程搜索时,遇到选中后再次搜索结果未刷新的bug。问题在于当查询结果长度与前一次相同时,select不会自动更新。通过在浏览器中调试源码发现,只有在'append'和'remove'事件时,下拉列表才会刷新。解决方案是在获取后端数据前清空select的list,从而确保每次搜索后都能正确刷新。
最低0.47元/天 解锁文章
2457

被折叠的 条评论
为什么被折叠?



