如何使用Redux窗體訪問React中動態命名字段的值？

這是我想要做的一點小背景。當用戶點擊添加旅程時，我使用Redux Form Field Arrays來創建字段。如何使用Redux窗體訪問React中動態命名字段的值？

我現在面臨的問題是，我希望表單字段陣列來更改基於什麼選項，用戶選擇行程類型（點至點，當地交通）。所以，我關注了Redux Form API網站上的一個例子Selecting Form Values。這不適合我，因爲字段名稱是動態的，我不知道如何使用動態字段名稱來完成此操作。這裏是我試過的代碼和任何幫助，將不勝感激。謝謝！

服務類型單選按鈕代碼：

<fieldset className="row"> 
    <div className="col"> 
     <Field name={`${member}.serviceType`} className="with-gap" component="input" type="radio" value="Point" id="trip1_choice1"/> 
     <label htmlFor="trip1_choice1"> 
     Point-to-Point 
     </label> 
    </div> 
    <div className="col"> 
     <Field name={`${member}.serviceType`} className="with-gap" component="input" type="radio" value="Local" id="trip1_choice2" /> 
     <label htmlFor="trip1_choice2"> 
     Local Transport 
     </label> 
    </div> 
</fieldset>

基於哪個單選按鈕改變形式的代碼選擇：

{[`${member}.serviceType`] === "Point" && 
    //HTML Form Code goes here 
}

正如你可以看到我在與訪問值麻煩的動態字段數組。 [${member}.serviceType]不起作用。

來源

2017-08-02 rohit563

使用ref's，ejem。

<Field ref='fieldName' name={`${member}.serviceType`} className="with-gap" component="input" type="radio" value="Point" id="trip1_choice1"/>

要訪問他們使用方法：this.refs.fieldName.getRenderedComponent().refs.input

檢查這個問題#1933上終極版型庫

來源

2017-08-02 20:46:25

感謝您的答覆！我研究過你說的話，並在字段中添加了'ref ='fieldName''，並且我還添加了'withRef =「true」'。我也改變了以下檢查到這個'{this.refs.fieldName.getRenderedComponent（）。refs.input ===「Point」&&'。現在我得到一個錯誤，說** TypeError：無法讀取未定義**的屬性'fieldName'。我做錯了什麼嗎？ – rohit563

@ rohit563嘗試使用'this.refs。['fieldName']。getRenderedComponent（）。refs.input' –

@ rohit563並在同一個組件中調試你的引用 –

如何使用Redux窗體訪問React中動態命名字段的值？

回答

相關問題