Reactjs 同步反应更新状态

我有一个

Master

组件，其中包含几个

子组件。子状态保存在Master中。子级得到的第一个状态是FORM_-LOADED。然后我的主组件中有下面的代码

const Master=（道具）=>{
const[formStates，setFormStates]=useState（）
useffect（（）=>{
SetFormState（{…FormState，主控：“FORM_LOADED”}）
},[])
渲染(
Model1
不会出现在
formStates
中。如果我添加更多子组件，只有最后一个组件会反映在
formStates
中。如何将Model1添加到
formStates
中？
我不确定是否能理解所有内容，但在setState（）方法中可以获得旧值。
您可以这样做：

const Child = (props) => {
  useEffect(() => {
    props.setFormStates(prevFormStates => ({...prevFormStates, [props.view]: "FORM_LOADED"}))
  }, [])
  render (
    <p>{props.view}</p>
  )
}

useffect（（）=>{
props.setFormState（（oldVal）=>（{…oldVal，…props.formState，[props.view]：“FORM_LOADED”}）；
});
返回{props.view}
；
};```
问题可能是您每次都在用新对象覆盖旧对象。请尝试：

const Master = (props) => {
  const [formStates, setFormStates] = useState()

  useEffect(() => {
    setFormStates((prev) => ({...prev, Master: "FORM_LOADED"}))
  },[])

  render (
    <>
      <Child view="Model1" formStates={formStates} setFormStates={setFormStates} />
      <Child view="Model2" formStates={formStates} setFormStates={setFormStates} />
      <pre>{JSON.stringify(formStates, undefined, 4)}</pre>
    </>
  )
}

const Child = (props) => {
  useEffect(() => {
    props.setFormStates((prev) => ({...prev, [props.view]: "FORM_LOADED"}))
  }, [])
  render (
    <p>{props.view}</p>
  )
}

const Child=（道具）=>{
useffect（（）=>{
props.setFormState（prevFormState=>（{…prevFormState[props.view]：“FORM_LOADED”}））
}, [])
渲染(
{props.view}

)
}
您好，您定义的方法将永远不会工作，因为您正在设置父进程的状态，其中父进程正在处理其全部子进程。

我想你是在检查你的孩子是否都做了渲染

React在调用父组件上的componentDidMount之前，会等待装入所有子组件

我认为这可以帮助您
在相同的重新渲染之前执行每个useEffect钩子中的所有代码。这就是React的工作方式。因此，它们中的每一个都使用旧的
FormState状态

您可以使用以下代码来使用
formState
的当前状态：

const Master=（道具）=>{
const[formStates，setFormStates]=useState（）
useffect（（）=>{
setFormState（（prev）=>（{…prev，Master:“FORM_LOADED”}））
},[])
渲染(
{JSON.stringify（formStates，未定义，4）}
)
}
const Child=（道具）=>{
useffect（（）=>{
props.setFormState（（prev）=>（{…prev[props.view]：“FORM_LOADED”}））
}, [])
渲染(
{props.view}

)
}
谢谢，它起作用了。没有提到我可以在useState钩子中使用上一个状态谢谢，它起作用了。没有提到我可以在useState钩子中使用上一个状态我正在使用功能组件（很抱歉，我在上面的问题中没有提到），我按照其他答案解决了它（使用上一个状态）谢谢，它成功了。没有提到我可以在useState钩子中使用上一个状态
const Master = (props) => {
  const [formStates, setFormStates] = useState()

  useEffect(() => {
    setFormStates((prev) => ({...prev, Master: "FORM_LOADED"}))
  },[])

  render (
    <>
      <Child view="Model1" formStates={formStates} setFormStates={setFormStates} />
      <Child view="Model2" formStates={formStates} setFormStates={setFormStates} />
      <pre>{JSON.stringify(formStates, undefined, 4)}</pre>
    </>
  )
}

const Child = (props) => {
  useEffect(() => {
    props.setFormStates((prev) => ({...prev, [props.view]: "FORM_LOADED"}))
  }, [])
  render (
    <p>{props.view}</p>
  )
}