Ant Design Modal中內嵌Form表單的initialValue值不動態更新問題

場景描述:

如下圖所示,點擊減免天數會出現一個彈窗, 輸入天數後點擊確定,保存這個值, 但是我在點第二行的減免天數的時候初始應該是空的, 可是現在顯示的是第一行輸入的值;

這裏寫圖片描述

這裏寫圖片描述

<Modal
    title="減免天數"
    visible={that.state.visible}
    onOk={that.handleOk.bind(that)}
    onCancel={that.handleCancel}
    >
    <Form horizontal form={form}>
        <FormItem {...{labelCol: { span: 5 }, wrapperCol: { span: 16 }}} label="減免天數:">
            <InputNumber min={0} step={1} {...{style: {width: 120}}} {...getFieldProps('currValue',{

                initialValue: that.state.currInputValue,

                rules: [
                    {required: true,message:"減免天數不能爲空"}
                ]
            })} />
        </FormItem>
    </Form>
</Modal>  

問題分析:

當我們第一次點開Modal的時候, FormItem會得到一個initialValue,但是這個值只在組件掛載的時候執行了一次, 當我們再次打開Modal窗口的時候並不會更新。

好了發現問題所在了, 接下來就是解決了~

解決方法:

Modal窗口我們都有應用一個Visible來控制是否顯示, 我們只要利用這個值得變化就可以實現Modal組件的重新掛載了。

{
    Visible && <Modal ....../>
}
發佈了95 篇原創文章 · 獲贊 137 · 訪問量 31萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章