题目
最近在做项目标时候, dialog组件回调close内里 一样寻常我都会加个resetFields 重置初始值和校验
其他地方都没题目, 在table组件内里出题目了, 厥后颠末监听vue tools, 查看到resetFields后, formData没变, 末了也找到缘故原由了.
办理
1、用 dialog【新增】、【修改】数据
2、先点击了【修改】，弹出弹窗，此时弹窗的form表单已经赋值
3、再点击新增按钮，此时调用resetFields()方法是没有办法使form清空的
如果直接只写this.$refs.formRef.resetFields()
由于编辑操纵是有数据回显的, 数据回显是在mounted阶段渲染上去的,
而 resetFields是将form表单重置到初始值，而这个初始值是form表单mounted后的值
效果就导致只能清空校验, 不能重置表单到我们想要的初始值
以是直接this.$data.roleFrom=JSON.parse(JSON.stringify(this.$options.data().roleFrom))
深拷贝roleForm yeah! 完成
引申
我的其他页面为什么没题目呢? 我厥后去看了其他组件的dialog为什么数据回显没题目, 由于其他组件我用到了watch 根据id变化执行渲染, 每次dialog close回调我都会自动把id清空为空字符串, 正好谁人接口id如果为空字符串也会发哀求, 获取的数据正好和回显的值不对应, 以是就为空了。本质上是重新发了哀求，但正好由于数据不对应不显示，造成了添加操纵时数据为空的正确表象。
总的来说照旧不严谨, 我这里要修改代码，watch这里加个if的意思是每次关闭会重置，但是打开不消重置。
① 子组件 watch if newVal===" " 上面的表单重置方法(这里空字符串我特意加了个空格看的清晰点, 实际重置不消加空格)
② 父组件dialog close回调内里添加一条 isEdit=false 防止子组件watch id变化为空字符时重复发ajax
加个增补
另有一点就是如果每次获取都是用ajax去获取数据, 那获取的也是新地点对象, 只是由于我部门数据用了本地已存在的引用数据, 以是才会有这种环境, 以是大家用引用数据肯定要留意, 如果发现有关联关系, 且影响业务, 都深拷贝一份吧
来源：https://blog.csdn.net/qq_59650449/article/details/128493928
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！ |
