在组件初始渲染之前使用 React hook 到运行 Mobx 方法

Using React hook to run Mobx method before initial render of component

如标题所示，我在 Mobx 商店中有我的状态。我有一个异步方法（操作），它获取数据并将其存储在商店内的属性中，我将从那里在必要的组件中访问它。

问题是，目前属性将在初始组件渲染中未定义 - 导致组件出错。

我如何利用 useEffect() 使其运行异步方法一次且仅一次 - 在初始组件呈现之前，确保状态可用于 return()？像这样：

const Workflow = () => {
    const store = useContext(WorkflowContext)

    useEffect(async () => {
        await store.getWorkflow()
    }, [])
...

您可以检查商店中的属性是否是组件中的 undefined 和 return null 如果是的话。

例子

const Workflow = () => {
  const store = useContext(WorkflowContext);

  useEffect(() => {
    store.getWorkflow();
  }, []);

  if (store.someProperty === undefined) {
    return null;
  }
  return <div>{store.someProperty}</div>;
};