Clever Geek Handbook

How do I force the data cache to update in react-apollo?

How refetch

fresh is the data when you go to the page with the data you are working on react-apollo

?

Let's say I visited the listing page for the first time. apollo

will fetch the request and cache it by default. This way, when you visit the same page again during your session, it will populate data from its cache store. How do I force the apollo

data to be updated every time the component is mounted?

+3


source to share


3 answers


You can use apollo

fetchPolicy . Based on this, he will decide whether to execute the request or not again.

Example:



const graphQLOptions = {
  name: 'g_schemas',
  options: (props) => {
    return {
      variables: {
        name: props.name,
      },
      fetchPolicy: 'cache-and-network',
    }
  },
}

Hope it helps.

+5


source


Adding to Pranesh's answer: fetchPolicy

what you are looking for is network-only

.



+4


source


In case you are using Query component react-apollo

, for example:

import { Query } from "react-apollo";

You can apply fetchPolicy through your props. Below is an example:

import gql from 'graphql-tag';
import React from 'react';
import { Query } from 'react-apollo';

const CounterView = ({ counter }) => (
  <div>{counter}</div>
);

const GET_COUNTER = gql'
  {
    counter
  }
';

const Counter = () => (
  <Query query={GET_COUNTER} fetchPolicy={'network-only'}>
    {({ data }) => {
      return <CounterView {...data} />;
    }}
  </Query>
);

export default Counter;

Recommendations:

0


source






More articles:


All Articles