Question

在docs中，我们只应在组件的顶层调用钩子。由于useEffect的API，return已被保留用于清理，这使我想知道如何早日退出useEffect挂钩以防止深入嵌套if语句。

// instead of
React.useEffect(() => {
  if (foo){
    // do something
  }
})

// I would rather write something like
React.useEffect(() => {
  if (!foo){
    // exit early and stop executing the rest of the useEffect hook
  }

  // do something
})

我该如何实现？在我的第一个示例中，复杂的条件逻辑会很快使事情变得混乱，尤其是考虑到我不能在条件语句中使用useEffect。

Answer 1

与任何功能一样，可以使用return关键字提前退出。

这两个片段是等效的：

React.useEffect(() => {
  if (foo){
    // do something
  }
})


React.useEffect(() => {
  if (!foo){
    return;
  }

  // do something
})

如何提前退出useEffect钩子？

1 个答案: