mpvue v-html标签消失,【微信小程序】基于 Mpvue 的微信小程序input 和 textarea光标自动跑到最后问题...

问题

在 Mpvue 小程序中，在 input 或 textarea 标签中，使用 v-model 绑定数据时，当要修改里面的数据时(比如快速打几个字或者删除一段话中间的几个字)，光标会自动回到段落的尾部。

解决

使用lazy修饰符，即 v-model.lazy 进行数据绑定

在进行数据传输或调用接口，或者提交的时候，做一个延时，使用setTimeout大概延时个100毫秒

分析

使用lazy修饰符有个缺点，就是lazy修饰符会被Vue编译成change事件，而mpvue会把change事件转换成blur事件，也就是当光标移动开时，才开始绑定数据值。

所以这样会导致，如果用户输入了最后一个输入框(使用lazy修饰符的)，没有将光标移开，而是直接点击提交，则最后一个提交会被忽略，看了下底层源码，是由于blur事件触发在点击提交之后，比较慢，所以导致这样的原因。

优点

这样的话，数据绑定的时候，光标不会闪烁，同时，在删除时，光标不会自动回到最后，也解决了提交blur时间太慢的问题

缺点

就算是使用了v-model.lazy，当遇到定时器进行实时修改数据时，会出现一定的bug

相关链接

参考：思否