vue 在 el-table 丢数据到 dialog 时数据会连动问题？

Question

假设我在数据 el-table 修改数据，并将数据丢给 dialog 展示方便编辑

<el-button
                round
                plain
                icon="el-icon-edit"
                size="small"
                @click="HandleEdit(scope.row)">
                修改
              </el-button>

HandleEdit

this.editData = row
      this.dialogVisible = true

此时假设我在 dialog 修改数据
修改的数据会跟著连动到 table 中
如何修正这个问题？

Answer 1

不要把原数据传递给dialog，而是拷贝一份再传过去，这可以使用JSON.paser和JSON.stringify

Answer 2

因为你那个 editData 和 row 是同一个引用啊……

想区分开就不要直接把 row 赋值给 editData，先深拷贝（Deep Clone）一次再赋值。

咋深拷贝你搜索一下吧，大把的专门干这个的库。