Redux-Form，如何使用帶有動態字段名稱的formValueSelector？

Question

我使用終極版的形式和試圖建立一個Field組件，像這樣：

<Rating 
    stop={10} 
    initialRate={selector(this.props.state, 'age')} 
    onRate={(rate) => this.onRateChange(rate)} 
    onChange={(value) => { this.changeRate("name", value) } } 
/> 
<span className="label label-default" id="label-onrate">{this.state.label}</span> 

<Field 
    name="age" 
    type="number" 
    component={renderField2} 
/> 

RateForm = reduxForm({ 
    form: 'rateForm' 
})(RateForm); 

const selector = formValueSelector('rateForm'); 

const mapStateToProps = state => { 
    return { 
    }; 
}; 

export default connect(mapStateToProps)(RateForm); 

我遇到的問題是initialRate是不工作...下面沒有返回值：

selector(this.props.state, 'age') 

因爲字段名稱將是動態的，我需要避免：

定義在mapStateToProps特定的字段名。

我在做什麼與Redux-formValueSelector錯誤不提供initialRate值？

Answer 1

你可以做這樣的事情：

import { getFormValues } from 'redux-form/immutable' 

getFormValues將返回與提供的form name保存的值。

const mapStateToProps = state => { 
    const formState = getFormValues('rateForm')(state) 
    console.log('formState...', formState) 
    return formState 
} 

這對我來說工作得很好。我收到了這個表格中所有Field組件的值，例如rateForm。 欲瞭解更多詳情，你可以去here。

Answer 2

從文檔：

函數從formValueSelector()返回具有以下 結構：

選擇器（狀態：對象，...字段：字符串）

state : Object [required] 

全球Redux狀態給予mapStateToProps。

...field : String [required] 

要選擇的字段或字段。如果您只提供一個 字段名稱，則該函數將返回該字段的值。如果 提供多個字段名稱，它將返回一個將 字段映射到值的對象。如果你的領域是「深」（即有一個或多個在 的名字），你回來的結構也會很深。例如如果您 領域是'a.b'和'a.c'，所產生的結構將{ a: { b:'bValue', c: 'cValue' } }.

在你的情況，你沒有返回從mapStateToProps什麼，

你的可能，而不必在評級組件選擇，有它在mapStateToProps和使用它像

<Rating 
    stop={10} 
    initialRate={selector(this.props.state, 'age')} 
    onRate={(rate) => this.onRateChange(rate)} 
    onChange={(value) => { this.changeRate("name", value) } } 
/> 


const selector = formValueSelector('rateForm'); 

const mapStateToProps = state => { 
    return { 
     state 
    }; 
}; 

上面的例子是假設props可向Rating組件。