Javascript 如何使用redux form onChange从存储中获取更新的值？

使用Redux form 8.2.2，每当FieldArray中的amount字段更新时，我想更新total字段。 My

updateTotal（）

函数在FieldArray上循环并对金额值求和，我通过

getFormValues（）

或通过

formValueSelector

获取金额值。但在这两种情况下，值都包含

onChange

之前的值，而不是

onChange

之后的值。 FieldArray调用的组件如下所示：

import React from "react";
import { connect } from "react-redux";
import { Field, getFormValues, change } from "redux-form";

const RenderTPP = props => {
  const { fields, dispatch, values } = props;

  const updateTotal = index => {
    let tppTotal = 0;
    values.tpp.forEach((item, i) => {
      tppTotal += parseFloat(item.amount);
    });
    dispatch(change("myForm", "total", tppTotal));
  };

  return (
    <tr>
      <td>
        {fields.map((tpp, index) => (
          <div key={index}>
            <Field
              name={`tpp[${index}].amount`}
              component="input"
              type="text"
              onChange={() => updateTotal(index)}
            />
          </div>
        ))}
      </td>
      <td>
        <Field name="total" component="input" type="text" />
      </td>
    </tr>
  );
};

export default connect(state => ({
  values: getFormValues("myForm")(state)
}))(RenderTPP);

而不是

onChange={() => updateTotal(index)}

及

---

用于

updateTotal（）

函数。这个变通方法似乎可以完成这项工作，但它并不适合我的情况，因为我想从我的应用程序的其他部分调用

updateTotal（）

。即使这似乎有效，我还是非常希望在

onChange

被解雇时直接从存储中获取更新的值。

这可以帮助您。您可能应该比较componentDidUpdate中的值，并在进行更改时调用您的函数，或者在updateTotal调用周围添加setTimeout谢谢您的链接和建议。由于我的组件是一个功能组件，我最终使用了

useffect（）

钩子，第一个参数是

（）=>{dispatch（…）}

，第二个参数是一个数组，其中列出了要在重新渲染之间进行比较的道具（这防止了无限循环）。我还可以添加一个条件，以避免在组件装载时触发分派（因为在装载和更新之后都会触发useEffect），但目前这不是一个大问题。这可以帮助你。您可能应该比较componentDidUpdate中的值，并在进行更改时调用您的函数，或者在updateTotal调用周围添加setTimeout谢谢您的链接和建议。由于我的组件是一个功能组件，我最终使用了

useffect（）

钩子，第一个参数是

（）=>{dispatch（…）}

，第二个参数是一个数组，其中列出了要在重新渲染之间进行比较的道具（这防止了无限循环）。我还可以添加一个条件，以避免在组件装载时触发分派（因为在装载和更新之后都会触发useEffect），但目前这不是一个大问题。

onChange={() => updateTotal(index)}

const updateTotal = (index, value) => {
  let tppTotal = parseFloat(value);
  values.tpp.forEach((item, i) => {
    if (i != index)
      tppTotal += parseFloat(item.amount);
  });
  dispatch(change("caseDataForm", "total", tppTotal));
};