react使用antd表單賦值,用于修改彈框的操作
更新時間：2020年10月29日 14:58:25 作者：妳丶好
這篇文章主要介紹了react使用antd表單賦值,用于修改彈框的操作，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
1、使用getFieldDecorator的initialValue
2、在state里定義一個變量存表格的數(shù)據(jù)
3、給打開彈框的方法傳個record
4、把表格里的值存到state
5、把在state里存的值傳給彈框
6、獲取傳過來的值
7、在取消方法和修改成功后中給賦空值，要不然，點擊添加的方法表單里面會有值
7、OK
補充知識：react中使用antd的表單重置數(shù)據(jù)
resetFields 重置一組輸入控件的值（為 initialValue）與狀態(tài)，如不傳入?yún)?shù)，則重置所有組件 Function([names: string[]])
注：initialValue有值時會重置為initialValue
使用：
//這個事件，可以是click可以是生命周期函數(shù)，具體看需求
componentWillUnmount() {
this.props.form.resetFields(); //這是重置為默認值
//在此進行相應(yīng)操作
console.log('值已經(jīng)清空')
}
以上這篇react使用antd表單賦值,用于修改彈框的操作就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
react Input組件Compositionstart和Compositionend事件
這篇文章主要為大家介紹了Compositionstart和Compositionend事件之于react組件庫Input組件的坑解決，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-11-11
這篇文章主要介紹了在?React?中使用?i18next,本文結(jié)合實例代碼給大家介紹的非常詳細，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2023-01-01
connect()是React-redux中的核心方法之一，它將react組件預(yù)redux中的Store真正連接在一起，下面這篇文章主要給大家介紹了react-redux中connect()方法的相關(guān)資料，文中介紹的非常詳細，對大家具有一定的參考學(xué)習(xí)價值，需要的朋友們下面來一起看看吧。2017-05-05
這篇文章主要為大家介紹了react-dnd?API拖拽工具的詳細用法示例，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-10-10
React函數(shù)式組件Hook中的useEffect函數(shù)的詳細解析
useEffect是react v16.8新引入的特性。我們可以把useEffect hook看作是componentDidMount、componentDidUpdate、componentWillUnmounrt三個函數(shù)的組合2022-10-10
react 跳轉(zhuǎn)后路由變了頁面沒刷新的解決方案
最近在學(xué)習(xí)React的過程中遇到了路由跳轉(zhuǎn)后頁面不刷新的問題，本文就詳細的介紹一下解決方法，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-06-06
React Native中WebView與html雙向通信遇到的坑
這篇文章主要介紹了React Native中WebView與html雙向通信的一些問題，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)吧2023-01-01
這篇文章主要介紹了ReactRouterV6如何獲取當前路由參數(shù)問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-03-03
React-Router(V6)的權(quán)限控制實現(xiàn)示例
本文主要介紹了React-Router(V6)的權(quán)限控制實現(xiàn)示例，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-05-05
react-native-tab-navigator組件的基本使用示例代碼
本篇文章主要介紹了react-native-tab-navigator組件的基本使用示例代碼，具有一定的參考價值，有興趣的可以了解一下2017-09-09