Rendered more hooks than during the previous render.
Do you know how can I fix this?
8 Replies
don't use hooks conditionally
react query allows you to "block" a query until something happens
U mean something like this?
yeah, do not use something like that
What can I do instead?
Solution
`
Oh well, didn't know about that
Really thanks
Dependent Queries | TanStack Query Docs
Dependent (or serial) queries depend on previous ones to finish before they can execute. To achieve this, it's as easy as using the enabled option to tell a query when it is ready to run:
There is plugin for eslint https://www.npmjs.com/package/eslint-plugin-react-hooks if interested. One of rules from plugin checks for conditional use of hooks.
npm
eslint-plugin-react-hooks
ESLint rules for React Hooks. Latest version: 4.6.0, last published: 10 months ago. Start using eslint-plugin-react-hooks in your project by running
npm i eslint-plugin-react-hooks
. There are 7596 other projects in the npm registry using eslint-plugin-react-hooks.