Refetch Concept

apollo
1

Im doing a refetch(something) of a query with a variable (ie. $something) that is used to filter a SQL table after that i want to get all the rows on the table so i use again a refetch() but… it brings the same query that refetch(something) generated.

doumentation says:

Note: If you just want to refresh the store with updated data, just refetch() without variables.

i am misunderstanding the refetch() function ? it doesnt call the ROOT_QUERY again ?

2

refetch() runs the same query again, but it sounds like you want it to run a different query, without the $something variable (or a different value)? In that case you’ll have to either run a new query (or if you’re using react-apollo, just change the props or state that generate $something and it will re-run automatically).

3

im using connect from react-apollo. My Component has the mapQueriesToProps on the export of the class.

i tried calling this.props.data.refetch() but like you said, it runs the same query again (with the old $something in it)

this is not a real example…

refetch 1: this.props.data.refetch({color: 'blue'})

after that i want all the colors again on my list

refetch 2: this.props.data.refetch()

(but it call the same query of refetch 1)

am i doing it wrong ? how do i call the base query to fetch all the rows and not the blue only ?

4

It looks like refetch with variables overwrites the initial variables to the new ones passed in. Can you pass in the original variables with the second refetch? Let me know if that works for you, if not we can figure out something else.

5

Works if i do:

Only blue refetch 1: this.props.data.refetch({color: 'blue'})

Only red refetch 2: this.props.data.refetch({color: 'red'})

but after that i i do

refetch 3: this.props.data.refetch()

it returns the refetch 2 i also tested it in a simple app with only GraphyQL up. The original variables are empty so it brings all the colors in the table.

6

try: this.props.data.refetch({})

If the argument isn’t present, refetch uses the previous variables; so you need to tell it to intentionally reset them to empty.

1 Like
7

If i do that i keeps waiting something… :pensive:

first load everything (resolver arguments print {} (shows all the data))

after that i do this.props.data.refetch({color:'blue'}) (shows all the blue ones)

next i try this.props.data.refetch({}) and it prints:

The inline argument "color" is expected as a variable but was not provided.

i have this query:

      query: gql`
        query getSomething($color: String){
          something(delito: $color){
              ...
          }
        }
      `,
      variables: {
        color: ownProps.color,
      },

am i missing something over there ?

By the moment im sending a $color “nothing” so i check in the resolver if color === "nothing" then… bring {}

thanks !!!