时间戳

首页 > 解决方案 > 使用相同的依赖值调用 useEffect 两次 - 依赖是可观察的 mobx 属性

reactjs - 使用相同的依赖值调用 useEffect 两次 - 依赖是可观察的 mobx 属性

问题描述

我有使用 useEffect 和 mobx 状态依赖的反应组件：

useEffect((): (() => void) => {
  console.log(appState.getCurrent());
}, [appState.getCurrent()]);

mobx状态下的相关代码：

@observable private current = {} as any;

@action public setCurrent(c: any) {
  this.current = c;
}

@computed public getCurrent() {
  return this.current;
}

很奇怪，但是 useEffect 以相同的值被调用了两次。
调试 setCurrent 方法，它只被调用一次。
更奇怪 - 我试图将依赖项更改为 appState.getCurrent().id，但它仍然以相同的值到达 useEffect 两次。
可能是因为使用 mobx 属性作为 useEffect 的依赖项？
我该如何解决这个问题？

标签： reactjsdependenciesuse-effectmobx-react

解决方案

您必须使用 with autorun如文档所示

useEffect((): (() => void) => {
  autorun(reaction)=>{
    console.log(appState.getCurrent());
  }
  
}, []);

推荐阅读