<Modal />
默認(rèn)關(guān)閉后狀態(tài)不會自動清空, 如果希望每次打開都是新內(nèi)容,請設(shè)置destroyOnClose
呜象。<Modal />
和 Form 一起配合使用時呼寸,設(shè)置destroyOnClose
也不會在 Modal 關(guān)閉時銷毀表單字段數(shù)據(jù)稳捆,需要設(shè)置<Form preserve={false} />
。
ant的Modal文檔中已經(jīng)寫了這倆方法躺翻,但我的編輯和添加彈框里表單的值還是延遲一次才更新
解決方法:
- Modal窗口我們都有應(yīng)用一個Visible來控制是否顯示丧叽, 我們只要利用這個值得變化就可以實現(xiàn)Modal組件的重新掛載了。
{ Visible && <Modal ....../> }
- 在useEffect中判斷公你,如果modal狀態(tài)發(fā)生改變踊淳,用form.resetFields()重置表單數(shù)據(jù)
如果第二種不生效,把Modal的狀態(tài)值也添加進(jìn)effect參數(shù)中
useEffect(() => {
form.resetFields();
}, [form, Visible]);
最后代碼:
useEffect(() => {
form.resetFields();
}, [form, Visible]);
return (
<>
{Visible && (
<Modal
visible={Visible}
destroyOnClose
>
<Form
form={form}
initialValues={}
preserve={false}
>
</Form>
</Modal>
)}
</>