Состояние гонки локального кэша состояния Apollo-клиента?

Такие методы, как readQuery и writeQuery, предназначены для чтения и изменения кеша внутри мутаций. Как правило, их не следует использовать непосредственно внутри компонентов. Вызывая readQuery, вы получаете данные из кеша только один раз. Вместо этого вы должны использовать компонент Query.

const TODO_QUERY = gql`
  query GetTodos {
    todos @client {
      id
      text
      completed
    }
  }
`

<Query query = {TODO_QUERY}>
  {({ data }) => {
    if (data.todos) return <ToDoListComponent todos = {data.todos}/>
    return null
  }}
</Query>

Компонент Query подписывается на соответствующие изменения в кеше, поэтому значение data будет обновляться вместе с вашим кешем.

Точно так же вы должны создать соответствующие мутации для любых изменений в кеше, которые вы собираетесь сделать, а затем использовать компонент Mutation для фактической мутации кеша.

const client = new ApolloClient({
  clientState: {
    defaults: {
      todos: []
    },
    resolvers: {
      Mutation: {
        addTodo: (_, { text }, { cache }) => {
          const previous = cache.readQuery({ query: TODO_QUERY })
          const newTodo = { id: nextTodoId++, text, completed: false, __typename: 'TodoItem' }
          const data = {
            todos: previous.todos.concat([newTodo]),
          }

          cache.writeQuery({ query, data })
          return newTodo
        },
      },
    }
  }
})

<Mutation mutation = {ADD_TODO}>
  {(addTodo) => (
    // use addTodo to mutate the cache asynchronously
  )}
</Mutation>

Дополнительные сведения см. в статье документы.