antd vue 单元格编辑

记录一下最近使用antd Pro vue 开发的项目遇到的问题。
背景：项目是个管理后台， UI框架使用antd vue ，主要都是表格编辑，编辑的的数据主要是为大屏服务的。
问题：表格中直接放入封装好的input组件，有些模块由于需要编辑的单元格不多，所以展示表格列表很快，但是当编辑的单元格特别多的时候，会把你的页面卡shi的…我项目中有多少个呢，有一个页面整整有800个单元格需要编辑，那就是800个input组件呀，把我卡的shi shi的…
来看一下表格直接放入input组件的效果哈

如果需要编辑的单元格少的话，这样子写是可以的，页面渲染很快，但是很多的时候，就不能够这么写了。
优化：
我将最后一个800个要编辑的页面优化了一下，就是进入页面的时候直接渲染数据，不需要渲染input组件，当鼠标滑过每个单元格的时候就有一个可编辑的icon，当用户点击icon的时候，被点击的单元格才可以点击，然后保存就点保存icon，取消就点取消icon.这就大大的优化了页面的性能。界面如下

以下是优化后的代码，业务逻辑就不写了：

    <a-table
        ref="table"
        size="default"
        :row-key="(record,index) =>index"
        :co