Vue的data重置---由清空表单数据部分失败

451 阅读1分钟

清空表单数据部分失败

场景:

A->B->C三个组件,A列表,B详情,C弹窗,A进入B请求B的数据写入表单,B中打开C使用form中pId字段。

原B中每次在 activatedthis.$refs.form.resetFields(); 重置表单 后发现 B中请求数据无结果时,C中得到的pId是上一次的值。

后发现在form表单中并未有pId表单项,只是在formData中有此字段。

1、可以直接手动置空 this.formData.pId=''

2、Object.assign(this.form,this.$options.data().form)

Object.assign(this.$data, this.$options.data())

this.$data:当前状态下的data,this.$options.data():该组件初始状态下的data。

Object.assign()方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。

目标对象有1个,后边可以有多个源对象。注意他只会拷贝源对象自身且是可枚举的属性到目标对象。该方法使用源对象的[[Get]]和目标对象的[[Set]],所以它会调用相关 getter 和 setter。

参考:www.cnblogs.com/vickylinj/p…