javascript - 对象解构在 ReactJs 脚本中不起作用

Question

我正在将 Next js 用于应用程序。代码组件具有存储在父组件中的全局状态，并使用 ReactContext 传递给子组件。

在其中一个组件中，当我尝试通过解构父状态来创建状态组件时，它的行为方式无法预测。有时解构会初始化本地状态，有时则不会。

const ContextEntry = () => {
  const { widget, pageStates } = useContext(WidgetContext);

  const { currentLanguage } = pageStates;
  // this statement produces an output..
  console.log("ContextEntry Component widget context  ", widget.context);

  //?? why not getting destructured
  // const [contextEntryData, setContextEntryData] = useState(widget.context);
  const [contextEntryData, setContextEntryData] = useState({
    ...widget.context,
  });
  console.log("State object ", contextEntryData);

  

   return (
    <div className={style.container}>
      {widget.fields.map((field) => {
        return (
          <CustomFieldWidget
            field={field}
            key={field.fieldId}
            updateContextEntry={updateContextEntry}
          />
        );
      })}
    </div>
  );
};

export default ContextEntry;