Question

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

问题是，当前该属性将在初始组件渲染时未定义-导致组件错误。

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

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

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

Answer 1

您可以检查存储中的属性是否为undefined，并在这种情况下从组件返回null。

示例

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

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

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

在组件的初始渲染之前使用React钩子运行Mobx方法

1 个答案: