Fairly common: triggering a side-effect that uses some state value, only when a different piece of state changes.
useEffect(() => { doSomething(someState) }, [otherState])
useEffect(() => { doSomething(someState) }, [otherState])
An empty dependency array means that the effect runs only once on mount. Same with memos and callbacks -- the value should remain stable. Here's a real world example of how I populate some state based on url query params:
https://github.com/Naught0/combinator/blob/master/frontend/s...
I may end up using a more robust routing solution to keep in sync with query params if I ever want to spend the effort, but this is a naive solution that works alright.
A more simplified, generic example could be:
const [foo, setFoo] = useState();
useEffect(() => {
setFoo("bar");
}, []); // The eslint rule wants setFoo here despite the value being stable