初步理解 ： initialValue就是所謂的defaultValue,只會(huì)在第一次賦值的時(shí)候改變，卻又有一些不同，因?yàn)?initialValue又會(huì)因其他改動(dòng)而改變。 然而當(dāng)獲取的數(shù)據(jù)重新上來要渲染的時(shí)候 ，initialValue的值卻又不改變，所以 讓人覺得很是捉摸不透。

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

例：如果第一步操作執(zhí)行的是修改操作，一些默認(rèn)值填充上去，如果不作處理，第二部執(zhí)行新增操作的時(shí)候，會(huì)把第一個(gè)默認(rèn)的值帶著，導(dǎo)致新增彈框彈出來的時(shí)候form表單中就是數(shù)值，效果體驗(yàn)特別不好，

后面發(fā)現(xiàn)在Modal文件里面添加componentWillReceiveProps中處理報(bào)表重置，就可以刷新form表單

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

?

后來還是會(huì)在同樣的坑里面跳 但這回不是在Modal里的Form,而是在類似TAB組件切換數(shù)據(jù)的時(shí)候，this.state的內(nèi)容變了，但是render的initialValue還是保留著原來的數(shù)據(jù) 解決方法 1 我第一想到的是強(qiáng)制刷新，window.location.reload() 但這樣的辦法并不是理想的效果

2 治根還得治本，我知道是initialValue的問題 但如果參考原來的在componentWillReceiveProps里面重置表單數(shù)據(jù)，會(huì)出現(xiàn)其他各種問題，因?yàn)?#96;``componentWillReceiveProps``這個(gè)函數(shù)你可能因?yàn)閯e的原因觸發(fā)了

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

后來想著，既然是因?yàn)閕nitialValue已經(jīng)有了初始化，那在切換操作的時(shí)候，將它清除掉好了，所以在離開的操作函數(shù)里添加 了?this.props.form.resetFields();

作者：sbwxffnhc
鏈接：https://juejin.im/post/5c67e01651882562a12ad79b
來源：掘金
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

轉(zhuǎn)載于:https://www.cnblogs.com/lanshu123/p/10966395.html

總結(jié)

以上是生活随笔為你收集整理的antd中的form表单 initialValue导致数据不更新问题的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。