-
Notifications
You must be signed in to change notification settings - Fork 9
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
The linter should also warn against bad practices inside hooks #34
Comments
Like this?
|
Like this: // should pass
// const val = {};
// should pass
// const setVal = () => /* ... */;
const useSomething = () => {
// should fail
// const val = {};
// should pass
const val = React.useMemo(() => {}, []);
// should fail
// const setVal = () => /* ... */;
// should pass
const setVal = React.useCallback(() => /* ... */, []);
return [val, setVal];
}; |
It's a great idea. This should definitely be done, and I hope to get to it. Thanks |
@cvazac I've run into a very similar situation which I hope can also be solved. Essentially the same issue, but any regular function (non-hook) that returns an object, array or function seems to be a workaround for the linting rules. We implemented the 4 recommended rules and I saw this kind of code slip through. This is a contrived example but it's essentially what I saw in our codebase after implementing the recommended lint rules. function Component() {
const value1 = getChildValue();
const value2 = {
foo: 'bar'
};
return (
<>
<Child value={value1} /> // <-- does not violate linting rule
<Child value={value2} /> // <-- violates linting rule
</>
);
}
function getChildValue() {
return {
foo: 'bar'
}
} |
This would be a useful rule. I notice the pattern of custom hooks returning a new reference every time all too often. |
If this is implemented, would it produce a warning or an error? |
@FPDK you can always configure whether something is an error or a warning yourself. |
I expect the lint to also work inside React hooks functions:
Every hook function (which is a function named
use*
should not constantly return a new reference (which is an object/function/array/JSX which is not created outside the hook nor inside auseMemo
/useCallback
).The text was updated successfully, but these errors were encountered: