2016-08-17 63 views
2

我正在使用Redux-Form v.5.2.3。我有一個文本輸入需要重複x次,具體取決於用戶點擊一個按鈕的次數。 目前,因爲我使用相同的字段名稱生成相同的輸入字段,所以它不起作用。當我在一個輸入上鍵入內容時,它會自動在其他輸入中鍵入相同的內容 - 這是因爲名稱相同。Redux-Form可重複字段

我想生成一個唯一的ID和附加是到外地「名」的 - 例如:

原產地領域:

名稱:<input type="text" {...name}>

第二場 - 按鈕後產生壓:

名稱:<input type="text" {...name2}>

X字段 - X按鈕PR之後產生esses:

名稱:<input type="text" {...nameX}>

任何想法是否可行和示例如何實現?

在此先感謝

+0

使用'key',這將區分它。 https://facebook.github.io/react/docs/create-fragment.html – Noitidart

+0

我不確定這是在Redux-Form中執行此操作的正確方法嗎? – user3047450

+0

我想我已經使用了一個字段作爲數組,並且我手動處理了它的更改,並且只更改每個指定字段的正確索引。 –

回答

1

我想看看在RF文檔deep forms

試圖弄清楚這一點,但根據我的理解,您可以使用[]表示法來定義字段數組。

export const fields = [ 
    'name[]', 
]; 

然後,您使用addField(value?, index?)添加其他字段。您可以通過將this.props.fields.name視爲name字段的數組來訪問每個字段。

對於你的情況,我認爲它應該是這個樣子

<div> 
    {this.props.fields.name.map((field, index) => (
    <input key={index} type="text" {...field} /> 
)} 
</div> 
+0

真棒,謝謝! – user3047450