1. 首先，需要确认mutation函数是否返回发生改变的数据（即修改后的数据），否则页面不会重新查询。
2. 在mutation完成后，手动触发查询请求，可以使用ApolloHooks提供的useQuery Hook来实现。

import { useMutation, useQuery } from '@apollo/react-hooks';
import gql from 'graphql-tag';

const ADD_TODO = gql`
  mutation AddTodo($text: String!) {
    addTodo(text: $text) {
      id
      text
      completed
    }
  }
`;

const GET_TODOS = gql`
  query GetTodos {
    todos {
      id
      text
      completed
    }
  }
`;

const Todos = () => {
  const { loading, error, data } = useQuery(GET_TODOS);
  const [addTodo] = useMutation(ADD_TODO, {
    update(cache, { data: { addTodo } }) {
      const { todos } = cache.readQuery({ query: GET_TODOS });
      cache.writeQuery({
        query: GET_TODOS,
        data: { todos: todos.concat([addTodo]) },
      });
    },
  });

  if (loading) return 'Loading...';
  if (error) return `Error! ${error.message}`;

  return (
    

      {data.todos.map(({ id, text, completed }) => (
        
{text}
      ))}
       {
          addTodo({
            variables: { text: 'New Todo' },
            optimisticResponse: {
              __typename: 'Mutation',
              addTodo: {
                __typename: 'Todo',
                id: -1,
                text: 'New Todo',
                completed: false,
              },
            },
          });
        }}
      >
        Add Todo
      
    
  );
};