如何用reduxform计算？

Question

我是 redux 形式的新手，我正在尝试添加两个值，2 个字段，如下所示：

 <Field
          className="uk-input"
          name="amount1"
          component="input"
          type="text"
          placeholder="dollars"
          onChange={this.handleChange}
        />

我使用在 handleChange 事件中调用的函数：

handleChange = () => {
    console.log("hoer");
    this.props.change(
      "selectingFormValues",
      "totaal",
      total(this.props.amount1 + this.props.amount2)
    );
  };

如何计算总数并将总数存储在 redux-form 存储中？

Answer 1

您可以使用 componentDidUpdate（并删除 handleChange）来计算更新后的总和：

componentDidUpdate() {
    const { amount1, amount2 } = this.props;
    const tootal = parseFloat(amount1 || 0) + parseFloat(amount2 || 0);
    this.props.change("selectingFormValues", "totaal", tootal);
  }

并将总分量更改为 input：

<Field className="uk-select" name="totaal" component="input" />

查看更新后的示例 https://codesandbox.io/s/jl6pwj2r75

或者，您可以在选择器中而不是在 componentDidUpdate:

中进行计算

componentDidUpdate() {
    this.props.change("selectingFormValues", "totaal", this.props.tootal);
}

在选择器中：

const mapStateToProps = state => {
  const { amount1, amount2 } = selector(state, "amount1", "amount2");
  const tootal = parseFloat(amount1 || 0) + parseFloat(amount2 || 0);
  return {
    amount1,
    amount2,
    tootal
  };
};

看到这一秒sandbox

如何用reduxform计算？

How to calculate with reduxform?

reactjs

redux-form