I'm using @apollo/client 3.2.0 with react. I have a component that retrieves the data using the useQuery hook. The query looks similar to this one:
query getChartData($year: Int!, $type: String!) {
first_series_data(kpi: "SOME_KPI", year: $year, orderBy: "week", type: $type) {
edges {
node {
value
week
}
}
}
second_series_data(kpi: "SOME_KPI", year: $year, type: $type) {
edges {
node {
date
value
}
}
}
}
As you can see in the query, I have two variables: year and type. Both are passed as props in the component and this component is rendered twice in the same view, with a different type prop.
The problem that I have is related to the fetchPolicy option. If I'm using one of cache-and-network
or network-only
fetch policies, one of the queries is called twice. This doesn't happen when I use no-cache
. So I think it's a cache conflict, because the queries are similar, but I'm not sure and I don't know how to fix this.
Do you have any ideas?