antd vue递归表单键值对无效

当我使用Object.keys获取到表单的key，打印出 [ 'title', 'type', 'state' ] 这样的数组，再通过map( )函数遍历Array中的值，通过每一个“ key “ 对它们配对的值递归修改

由于String类型也可以作为Object的key，而此处map( )函数中“ k ” 的值应该为 ' title '，这么看来 “setFieldsValue({ k: undefined })” 应该是生效的，但这并没有起到作用。

所以我开始把聚焦点放在antd提供的setFieldsValue方法上，无果，最终发现问题出在{ k: undefined }中“ k ” 的指向上。

1 const tempFieldsValue = this.form.getFieldsValue()
2         Object.keys(tempFieldsValue).map((k) => {
3           if(typeof(tempFieldsValue[k]) === 'string' && tempFieldsValue[k].indexOf('---') !== -1) {
4             this.form.setFieldsValue({ k: undefined })
5           }
6         })

后来发现原因是 “{ }”本身是一个new Object()的语法糖，在第4行函数的参数中，如果写成{ k: undefined }，k 将会被解析成一个新的键，从通俗意义上来讲就像是声明了一个新的变量，它的指向并不会指向map函数中的item.
这样一来setFieldsValue并不是不生效，只是作用在了键为“ k ”的表单项中，我在HTML中增加了一个键为k的表单项，通过这行语句果然改变了这个表单项的值，

this.form.setFieldsValue({ [k]: undefined })

将第4行改成这样的形式，通过 [ k ] 来改变“ k ”的指向，使得它能获取到map( )函数item的值，最终得以解决。

果然JS最重要的还是基础语法。

标签：map,vue,undefined,setFieldsValue,Object,tempFieldsValue,键值,key,antd
来源： https://www.cnblogs.com/97z4moon/p/14348338.html