antd中的form表单 initialValue导致数据不更新问题

初步理解 ： initialValue就是所谓的defaultValue,只会在第一次赋值的时候改变，却又有一些不同，因为 initialValue又会因其他改动而改变。 然而当获取的数据重新上来要渲染的时候 ，initialValue的值却又不改变，所以 让人觉得很是捉摸不透。

解决：````this.props.form.resetFields();```

例：如果第一步操作执行的是修改操作，一些默认值填充上去，如果不作处理，第二部执行新增操作的时候，会把第一个默认的值带着，导致新增弹框弹出来的时候form表单中就是数值，效果体验特别不好，

后面发现在Modal文件里面添加componentWillReceiveProps中处理报表重置，就可以刷新form表单

componentWillReceiveProps(nextProps) {
    if (!nextProps.modal.modalUpdateDetail) {
      this.props.form.resetFields();
    }

 

后来还是会在同样的坑里面跳 但这回不是在Modal里的Form,而是在类似TAB组件切换数据的时候，this.state的内容变了，但是render的initialValue还是保留着原来的数据 解决方法 1 我第一想到的是强制刷新，window.location.reload() 但这样的办法并不是理想的效果

2 治根还得治本，我知道是initialValue的问题 但如果参考原来的在componentWillReceiveProps里面重置表单数据，会出现其他各种问题，因为```componentWillReceiveProps``这个函数你可能因为别的原因触发了

componentWillReceiveProps(nextProps) {
    if (!nextProps.modal.modalUpdateDetail) {
      this.props.form.resetFields();
    }

后来想着，既然是因为initialValue已经有了初始化，那在切换操作的时候，将它清除掉好了，所以在离开的操作函数里添加 了 this.props.form.resetFields();

作者：sbwxffnhc
链接：https://juejin.im/post/5c67e01651882562a12ad79b
来源：掘金
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

转载于:https://www.cnblogs.com/lanshu123/p/10966395.html