根据其他两个字段设置redux-form字段值

Question

因此，以redux形式，我已经看到了许多基于另一个Field来更新Field值的方法。 我的具体情况正在更新Field基于两种不同的价值Fields 。

建议实现此目的的两种流行方法是1.） redux-form的规范化器 ，以及2.）在调用Field1的onChange时，手动分派redux-form的change方法来更改Field3的值。 这两个解决方案似乎都不适用于我，原因如下：

1. 规范化器 ：假设我有3个字段Field1 ， Field2和Field3 。 当更改Field1或Field2中的任何一个时，我需要设置Field3的值。 更改Field1时，也会自动设置Field2的值 。 假设我在Field1上定义了一个规范化器，用于检查整个表单的值。 在这种情况下，在我的规范化函数中， Field1的值得到了更新，但是Field2保留了它的旧值。 这可能是来自redux-form的一些奇怪行为。

2. 从Field1或Field2的onChange内部在Field3上手动调度redux-form的change方法 -问题是，如果我尝试在Field1的onChange内部访问Field1的值，则该方法将传递给Field1的onChange保留Field1的旧值。 因此，我无法根据Field1的新值可靠地设置Field3的值。

关于如何解决此问题的任何建议都将有所帮助。 谢谢！

Answer 1

尝试这个：

为field3创建一个组件（例如Field3），并以这种形式使用它

<Field name="field3" component={Field3} />

在Field3组件中，我们还将field1和field2的值注入到Field3组件中。 这样，无论何时更新组件，我们都可以检查是否是由于field1或field2引起的，然后我们相应地更新field3：

import React from 'react';
import { formValues } from 'redux-form';

class Field3 extends React.Component {
  componentDidUpdate(prevProps) {
    if (this.props.field1 !== prevProps.field1 || this.props.field2 !== prevProps.field2) {
      // field1 or field2 has changed. update field3
      this.props.input.onChange('new value goes here')
    }
  }

  render() {
    // your input here
  }
}

export default formValues('field1', 'field2')(Field3);