前言
最近在用react antd學做公司后台管理系統,遇到一個小問題,
想要點擊編輯按鈕后把作品描述中的小貓搭橋的值回顯在modal彈出框中的input中
antd表單組件的form.create()中有一個getFieldDecorator()提供了initialValue屬性來顯示input回顯值,
但initialValue屬性必須設置在getFieldDecorator()中,而這個方法在antd3中必須要用form.create()包裹才行,
個人感覺代碼有點冗雜,想簡化一下代碼,后發現新版本antd4中已經進行了簡化,並且刪除了form.create(),
但因為antd4還不太穩定,擔心項目出問題,並且antd3目前也滿足需求,所以不打算升級到antd4,
如果沒有使用form.create()應該怎么設置回顯呢?
解決方法
給input value值設置為獲取到接口數據后的對應值,比如下面的formConfig對象(formConfig對象名可自定義)
里面裝着請求接口后得到的數據(formConfig.name的值為請求接口實際返回的name值)並綁定onChange事件
觸發onChange后,先把獲取接口的數據賦值給一個變量,比如下圖formConfigInfo,
然后把event對象的target值賦值給formConfigInfo.name,最后設置formConfig的值為formConfigInfo