Question

我使用redux表单并尝试创建一个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-form 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]
给予mapStateToProps的全局Redux状态。
 ...field : String [required]
您要选择的字段或字段。如果您只提供一个字段名称，该函数将返回该字段的值。如果你提供多个字段名称，它将返回一个对象映射字段到值。如果你的领域是＆＃34;深＆＃34; （即有一个或多个.in 这个名字），你得到的结构也会很深。例如如果你的字段为'a.b'和'a.c'，结果结构为{ a: { b:'bValue', c: 'cValue' } }.

在您的情况下，您没有从mapStateToProps返回任何内容，

您可以在Rating组件中使用选择器，而不是在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。

Answer 3

@Ritesh指出解决方案：

Analyze APK...

希望这对某人有帮助！

Redux-Form，如何使用带有动态字段名称的formValueSelector？

3 个答案: