useQuery fails to return cached data when variables are changed

[zicodeng]

Consider the following queries

useQuery(POSTS, {
  variables: {
    offset: currPage * 20
  }
})

where currPage is a React local state variable. It will get updated when user paginates

Intended outcome:

When currPage=1, new data is fetched, when currPage=2, new data is fetched... When user paginates to the previous page (page 1), because query with currPage=1 is already fetched, it should just read the cache

Actual outcome:

When user paginates from page 1 to page 2, new data for page 2 is fetched, however, when user paginates back to page 1, cache is not read, data is still displayed for page 2

How to reproduce the issue:

Versions

@apollo/client: ^3.0.0-beta.14
react-apollo: ^3.1.3

Issue is also reported in Apollo client GitHub: apollographql/apollo-client#5659