since the latest version upgrade, react-hooks/exhaustive-deps disallows using a factory function for useEffect
:
// considered ok:
function Component1({ name }) {
React.useEffect(
function effect() {
console.log('wazzup', name);
},
[name],
);
return 'yay!';
}
// considered bad now:
const effect2 = (name) => () => {
console.log('wazzup', name);
};
function Component2({ name }) {
React.useEffect(effect2(name), [name]);
return 'yay!';
}
Problem is, we preferred the second approach (which is considered bad practice now) because it allows us to test the effect-function in a nicely isolated way. It also reduces nesting a bit, which was a nice bonus.
What would be a good alternative approach that would still allow us to test the code for effect2
in an isolated way?
Aucun commentaire:
Enregistrer un commentaire