el-table可编辑/输入框 卡顿性能问题解决案

问题

用el-table配合el-input直接渲染可编辑行，在数据量大的情况下，会出现输入卡顿的问题。

原因分析

1. el-input组件实例数量过多。
2. el-input的v-model在表单输入时频繁触发更新事件。

解决思路

1. 用原生input替换el-input，以减少el-input组件实例。并在原生input上应用el-input的样式，使前者后者外观一致。
2. 在v-model指令上追加.lazy修饰符，使实例数据仅在失去焦点时更新，减少触发次数。
   

优缺点

优点：

1. 解决了可编辑el-table在数据量大的情况下的性能问题。

2. 与网上我能够搜索到的大部分解决方案不同，没有额外引入第三方插件。

3. 实现方式简单、快速、方便。

缺点：

1. 没有使用el-input组件，不能直接使用el-input提供的功能。