useQuery causes a component to render multiple times
See original GitHub issueIs it normal with this new hooks api to re-render a component multiple times? I just saw that useQuery causes a component to re-render 3 times. Here is an example: https://codesandbox.io/s/j7kw103525
It’s the same, example from the readme file, I have just added a console log to /views/Details.js
const Detail = ({
match: {
params: { breed, id }
}
}) => {
const { data, error } = useQuery(GET_DOG, {
variables: { breed }
});
console.log(2);
return (
<View style={styles.container}>
<Header text={breed} />
{error ? (
<Error />
) : (
<DogList...
And the output is: 2 2 2
I have tried on my own project and got the same result.
Issue Analytics
- State:
- Created 5 years ago
- Reactions:22
- Comments:31
Top Results From Across the Web
React-Query makes component to rerender multiple times
When i change the page state to cause thw query re run it renders the component 3 times and the first 2 are...
Read more >Relation between re-render and useQuery - Help
The useQuerey hook will trigger a re-render when it receives a response from the graphql backend (whether that response is data or an...
Read more >Why does useQuery call cause a re-render in my component?
In the above you can see your component has state (not props) data , loading and error which causes your component to re-render....
Read more >5 Ways to Avoid React Component Re-Renderings
How to Avoid Unnecessary Re-rendering in React. React components have evolved a long way from their inception. Still, many developers find ...
Read more >React re-renders guide: everything, all at once
If in Context there is a combination of data and API (getters and setters) they can be split into different Providers under the...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found

I am still having this issue
I have the same problem. useQuery causes 2 renders even if the query result is already cached.