vue表单弹窗最大化无法渲染复杂组件内容
背景:最大化后选然后复杂组件内容丢失,如下拉框、图片上传组件
-
修复方案:使用深拷贝
-
核心代码
this.maximizeDialog = {visible: true,title: '患者申请 - 最大化查看',formModel: JSON.parse(JSON.stringify(this.formModel || [])),formLogic: JSON.parse(JSON.stringify(this.formLogic || {})),formData: JSON.parse(JSON.stringify(this.formData || {}))
};
console.log('最大化弹窗数据', this.maximizeDialog);
- 原理:
maximizeDialog在赋值后,如上,如果没有深拷贝
只是向下面一样赋值, 则会出现丢失数据问题。我认为的原因是在maximizeDialog这个json中如果这样写就只是做到了较浅的响应式引用
formModel: this.formModel,
formLogic: this.formLogic,
formData: this.formData