子状态无状态功能组件即使在父状态更新后也不会更新

Question

我的父组件的状态为print((max_row+i, max_col) for i in range(max_length) ，最初设置为false。我的表单也有一个提交按钮。我希望禁用提交按钮，直到某些输入字段（输入的名字和姓氏）中包含数据之后。

这是我的状态：

formIsValid

此函数处理对名字和姓氏输入的更改：

  state = {
    employees: [],
    costEstimates: emptyCosts(),
    relationshipOptions: [],
    newEmployee: emptyEmployee(),
    formIsValid: false
  };

这就是将 // handle input into "First Name" and "Last Name" inputs handleChangeValue = async e => { const newEmployee = { ...this.state.newEmployee }; newEmployee[e.currentTarget.name] = e.currentTarget.value; this.setState({ newEmployee }); this.validateIfCanBeSubmitted(); await this.updateCostsData(newEmployee); // this is an api thing, not relevent }; 属性设置为状态的原因。此属性作为道具发送到“提交”按钮。

formIsValid

如果状态中的employee属性的名字和姓氏为空，则将为此提供的提交按钮正确禁用。问题在于它“在1次更新后关闭”。好像道具直到下一次状态改变后才传播到子按钮组件。这是问题的gif：

这是子组件的外观。这只是一个常规的HTML按钮，但是它位于无状态功能组件中，因此问题不在于组件的状态：

  validateIfCanBeSubmitted = () => {
    const { firstName, lastName } = this.state.newEmployee;

    let formIsValid = firstName && lastName ? true : false;

    this.setState({ formIsValid });
  };

Answer 1

Solving environment: failed UnsatisfiableError: The following specifications were found to be in conflict: - conda[version='>=4.5.11'] - ipython-notebook Use "conda info <package>" to see the dependencies for each package. 是异步的！
setState()在旧状态下执行；执行您的功能时，此更新this.validateIfCanBeSubmitted();尚未传播到this.setState({ newEmployee });。

为this.state提供更新功能。

validateIfCanBeSubmitted

并相应地使用它：

validateIfCanBeSubmitted = ({ newEmployee: { firstName, lastName }}) => {
  return {
    formIsValid: firstName && lastName ? true : false
  };
}

实际上，handleChangeValue = async e => { const {name, value} = e.currentTarget; const newEmployee = { ...this.state.newEmployee, [name]: value }; this.setState({ newEmployee }); this.setState(this.validateIfCanBeSubmitted); // this is an api thing, not relevant await this.updateCostsData(newEmployee); }; 中的代码也应该具有这样的功能，因为它使用先前的状态来计算新的状态。

那么如何将它们结合起来

handleChangeValue