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

问题描述:

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

原因: 

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

解决方法:

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

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

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

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值