React #Rules of Hooks

React Rules of Hooks

 

Only call React Hooks in React Functions

1. React Component Functions
2. Custom Hooks

 

Only call React Hoos at the Top Level

1. Don't call them in nested functions
2. Don't call them in any block statements

 

+ extra, unoffical Rule for useEffect(): ALWAYS add everything you refer to inside of useEffect() as a dependency

useEffect(() => {
  setFormIsValid(email && password)
}, [email]); // (x)

useEffect(() => {
  setFormIsValid(email && password)
}, [email, password]); // (o)