Vue中表单更新取消操作的注意事项

坑:今天写了一个更新操作的表单,但是当取消操作时,表中的原有数据被污染了,很纳闷。

原因:后来知道赋值操作的时候把地址给共同绑定了,这也是一个js的基础问题,对象等赋值数据类型的值和址应用等知识点。

解决策略

1
2
3
4
5
editHandel(row){
let copy = Object.assign({}, row)
this.$refs.infoEdit.editDialogVisible = true
this.$refs.infoEdit.editForm = copy
},

主要利用了 Object.assign({}, xxx) 方法。

Object.assign()方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。不会引用原地址。不会修改到原来的内容。

文章作者: GeYu
文章链接: https://nuistgy.github.io/2023/03/14/Vue中表单更新取消操作的注意事项/
版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 Yu's Blog