在 React 组件中改变外部变量

【问题标题】：Mutating outer variables inside React Component在 React 组件中改变外部变量
【发布时间】：2016-08-18 04:21:37
【问题描述】：

我正在尝试创建一个包含可变数量复选框的表单（使用 redux-form）。

但是，这些复选框是通过 props 传递给组件的。因此，我无法在导出的字段部分中使用它们：

export default reduxForm({
    form: 'formCheckBoxes',
    fields: fields,
    validate
}, mapStateToProps, actions)(FilterComponent);

请帮助我，我在这个问题上花了几个小时。

【问题讨论】：

您应该在 Redux Form 网站上查看 Deep Form：redux-form.com/5.3.1/#/examples/deep?_k=ixmfya 有循环字段的示例：)
你可以使用'react-redux' npm 模块中的 connect 并执行以下操作：export default connect(state => ({ fields: state.fields, }), actions)(FilterComponent);

【解决方案1】：

来自the docs：

重要提示：所有这些配置选项都可以在“设计时”传递给 reduxForm()，或者在运行时作为 props 传递给您的组件。

这意味着fields 可以作为装饰组件的道具。

FilterComponent = reduxForm({
  form: 'formCheckboxes',
  validate
})(FilterComponent)

然后，在您拥有fields 的容器中：

<FilterComponent fields={myFields}/>

【讨论】：