Something new for React 16.7: Hooks
Quick and dirty intro example is adding state to a functional component using the useState hook:
import { useState } from 'react';
function Example() {
// Declare a new state variable, which we'll call "count"
const [count, setCount] = useState(0);
return (
<div>
<p>You clicked {count} times</p>
<button onClick={() => setCount(count + 1)}>
Click me
</button>
</div>
);
}
Basically, as a function component you have a function (Example) that runs whenever its rendered, yet this useState() function as part of this feature manages to maintain persistence with a state initialized the first time its run and is updated as you use one of its return values - something that happens with every subsequent render.
Additionally, order of execution for these hooks is important as it is what is used by React to keep track of them. This means you have special requirements for how they’re used (explained in later parts of the link).
…
I find them … interesting, but a little disturbing at the same time. This is starting to get into the realm of “too much magic”.
