一、要使用“深拷贝”可以使用cloneDeep这个方法,此时需要在vue项目可视化面板中安装开发依赖项loadsh.
二、在需要使用“深拷贝”方法的组件JS代码区引入这个包。
import _ from 'lodash'
三、使用方法cloneDeep()。
例如:在这里,goods_cat是addGoodsForm对象中的一个属性,goods_cat这个属性,在页面展示时需要提供的是数组,但是在向服务器端口发送请求,提交数据时,需要的是字符串,于是就产生了冲突。
所以,需要将addGoodsForm这个对象进行深拷贝,就是把这个对象在处理之前再拷贝一份(就是在向接口发送数据请求之前,深拷贝一份修改数据类型再发送),这样两个对象是互相不影响的。因为改变了他们的存储地址,是相互独立的,所以互不影响。
addGoodsForm: {
// 商品所属的分类数组
goods_cat: []
}
// 将addGoodsForm对象进行深拷贝保存到form中
const form = _.cloneDeep(this.addGoodsForm);
//将属性goods_cat数组转换为用逗号连接的字符串
form.goods_cat = form.goods_cat.join(',');