我有一个 useEffect,它有两个依赖项:
useEffect(() => { doSomething(); }, [currentTenant, currentProjects])
但是,currentProjects 正在 useEffect 中设置,该 useEffect 具有 currentTenant 作为依赖项:
useEffect(() => { setCurrentProjects(); }, [currentTenant]);
doSomething()
取决于这两个状态,所以我想知道当 currentTenant
更改时 doSomething()
是否会运行两次:一次当 currentTenant
本身更改时,一次当 currentProjects
(由 currentTenant 控制)
) 更改。< /p>
这是多余的吗?这样做更好的方法是什么?也许通过从 doSomething()
useEffect 中删除 currentTenant
。
预先感谢您的帮助。
我认为你让事情变得容易出错并且不必要地复杂化。根据我的经验,每当人们。尝试聪明地使用
useEffect
,他们只是破坏了它。首先,确保
currentTenant
和currentProjects
是原语 - 我想情况还不是这样(例如名为currentProjects
的东西),因此您的依赖项无论如何都不会按预期工作。其次,如果可能的话,内联
doSomething()
和setCurrentProjects()
的代码,这样可以更轻松地跟踪您实际依赖的变量/依赖项。如果您已将这些方法传递给组件或在多个位置使用它们,则存在例外情况。第三,不要依赖调用多个
useEffect
挂钩的执行顺序。文档中没有保证顺序,而且对于异步调用来说也没有多大意义。使它们彼此独立。因此,在无法确定的情况下不要假设冗余。此外,即使它按预期工作,这也是过早的优化 - 好处可以忽略不计,但代码更难理解。第四,您依赖于组件中不会发生任何变化的想象力,并且您未来的自己以及您的同事将确切地知道/记住您的依赖性考虑因素。或者你必须用冗长的解释来评论它,让想法变得更加复杂。
一般来说,
useEffect
依赖项应尽可能简单且富有表现力。他们没有太多魔法,但有很多人。尽管如此(包括我)有时也会把它们搞砸。当您大多数时候偏离“仅列出您正在使用的所有基元”规则时,就会发生这种情况。