From b6b66fe30de7eb1e149e42635af7e0c054b9106b Mon Sep 17 00:00:00 2001 From: James Pearce Date: Tue, 30 Oct 2018 20:37:13 -0700 Subject: [PATCH] Clarify that you can't return early between hooks ...Otherwise you get an error like `Uncaught Error: Rendered fewer hooks than expected. This may be caused by an accidental early return statement.` in `finishHooks`. --- content/docs/hooks-rules.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/hooks-rules.md b/content/docs/hooks-rules.md index 039a3f9a662..5c147223cb1 100644 --- a/content/docs/hooks-rules.md +++ b/content/docs/hooks-rules.md @@ -12,7 +12,7 @@ Hooks are JavaScript functions, but you need to follow two rules when using them ### Only Call Hooks at the Top Level -**Don't call Hooks inside loops, conditions, or nested functions.** Instead, always use Hooks at the top level of your React function. By following this rule, you ensure that Hooks are called in the same order each time a component renders. That's what allows React to correctly preserve the state of Hooks between multiple `useState` and `useEffect` calls. (If you're curious, we'll explain this in depth [below](#explanation).) +**Don't call Hooks inside loops, conditions, or nested functions, nor after conditional return statements.** Instead, always use Hooks at the top level of your React function and make sure every one is called. By following this rule, you ensure that the same number of Hooks are called in the same order each time a component renders. That's what allows React to correctly preserve the state of Hooks between multiple `useState` and `useEffect` calls. (If you're curious, we'll explain this in depth [below](#explanation).) ### Only Call Hooks from React Functions