编辑流程
- 原始数据 赋值到 临时变量。
- 使用临时变量填充表格。
- 修改表格即修改临时变量。
- 取消修改,使用原始数据覆盖临时变量。
- 提交修改,使用临时变量的数据覆盖原始数据。
全新的临时变量
但我们在使用原始数据和临时变量时存在拷贝问题,即修改了临时数据,原始数据也发生了改变。归根结底,就是变量直接赋值的时候,新变量和原变量的地址指向同一块内存地址,所以改新变量,也会改变原变量。以下是数组和对象的隔离拷贝:
-
数组赋值
Lodash 深拷贝 =》 _.cloneDeep(value)
this.tempTableData = _.cloneDeep(this.tableData);
-
对象赋值
Lodash 深拷贝 =》 _.assign(object, [sources])
this.tempTableData = _.assign({}, this.tableData);