Question

在App.js的状态下，我在每个状态下都有大量信息：

fields: {
    what_is_your_name: {
      value: null,
      dirty: false,
      valid: null,
      errorText: null,
      step: 1,
      validationRules: {
        required: true
      }
    } //... etc

加载组件时，我想更新它是否有效-所以我使用了一个钩子：

useEffect(() => {
props.validateField(props.value, fieldName, props.validationRules);
  }, []);

这将调用validateField，它应该检查该字段是否有效，如果无效，则更新错误文本：

const allFields = this.state.fields;
const allValues = this.state.fields[fieldName];
var errorText = null;

if (!value) {
  errorText = "This field is required";
} else {
  errorText = null;
}

this.setState(
  {
    fields: {
      ...allFields,
      [fieldName]: {
        ...allValues,
        errorText: errorText
      }
    }
  },
  () => {
    console.log("the state was set");
  }
);
  }

我在屏幕上有4个组件，应该全部更新。与最后一个组件相关的状态始终会更新，但是前三个组件不会受到影响-即使我切换了这些组件。

我怀疑这是时间问题？

（我尝试了另一种在按下按钮时在循环上点击validateField方法的方法，但这也导致只更新了其中一个）

多个组件设置状态仅导致一次更改

0 个答案: