优化el-table表格输入框卡顿,v-model加lazy修饰符(输入数据不保存,会自动复原)

白泽语
2023-12-01

问题描述:

表格数据是后端接口渲染的,数据量比较大,表格中输入框的数据也是由后端数据渲染的,输入框的值由v-model双向绑定,现在用户输入文字会卡顿,不流畅!

原因: 

v-model是双向绑定,数据一旦变化就会触发更新,整个表格的数据比较大,加载自然卡顿;(这里用的原生input框,v-model.lazy生效)

解决方法:

(1)加上修饰符lazy(数据输入完毕,光标失焦或者按enter键才触发视图更新)—— 不卡了,但是出现新的问题—— 输入的数据不会保存,并且会自动复原到原始数据(不行)

(2)input框的值用value来表示,不用v-model——出现的bug跟上面一样(不行)

(3)把该input框抽出来写成一个单独的组件,再引入(可行)

 类似资料: