将数据存储在Reaction组件外部并从组件内部更改数据并从中派生状态合法吗？这在更新复杂的深度嵌套状态时可能会有所帮助。

import React from "react";

let globalState = {
  foo: { bar: { baz: { value: 0 } } },
};

const Component = () => {
  const [state, setState] = React.useState(globalState);
  let baz = globalState.foo.bar.baz;

  const changeValue = () => {
    baz.value += 1;
    setState({ ...globalState });
  };

  return (
    <div>
      <label>{state.foo.bar.baz.value}</label>
      <button onClick={changeValue}>change</button>
    </div>
  );
};