vue中关于赋值的坑

在使用弹窗展示表格数据详情的时候，由于字段名都取一样的，在详情弹窗页面，不会在data中去特意定义每个字段名。直接用上个页面的传值，通过赋值让值直接显示:

比如: this.ruleForm = data

如果，在你需求中没有清空或者更改data中数据或许并不会产生问题。但如果在这个页面需要对数值进行改变，但在上个父页面中，不需要值发生改变就会产生一个bug。

你会发现，在弹窗页面中改的值，在父页面 相同字段也会发生改变。

原因:这边的赋值并不是 真正的赋值，而且地址的引用。将同样的地址 引用给另一个变量去使用。

解决方法:

使用JSON.parse和JSON.stringif来把具体值进行转换赋值。

例: this.ruleForm = JSON.parse(JSON.stringif(data))