如何使用React apollo客户端缓存搜索数组？

import ApolloClient from "apollo-boost";

const client = new ApolloClient({
  uri: "YOUR_GRAPHQL_SERVER_URL",
  cache: new InMemoryCache(),
});

export default client;

import React from "react";
import ReactDOM from "react-dom";
import { ApolloProvider } from "react-apollo";
import { ApolloProvider as ApolloHooksProvider } from "@apollo/react-hooks";
import client from "./client";
import App from "./App";

ReactDOM.render(
  <ApolloProvider client={client}>
    <ApolloHooksProvider client={client}>
      <App />
    </ApolloHooksProvider>
  </ApolloProvider>,
  document.getElementById("root")
);

import React from "react";
import { useQuery } from "@apollo/react-hooks";
import { gql } from "apollo-boost";

const GET_SEARCH_RESULTS = gql`
  query GetSearchResults($keyword: String!) {
    search(keyword: $keyword) {
      id
      title
    }
  }
`;

const SearchResults = ({ keyword }) => {
  const { loading, error, data } = useQuery(GET_SEARCH_RESULTS, {
    variables: { keyword },
  });

  if (loading) return <div>Loading...</div>;
  if (error) return <div>Error</div>;

  // 将查询结果存储在 Apollo Client 的缓存中
  client.writeData({ data });

  return (
    <div>
      {data.search.map((item) => (
        <div key={item.id}>{item.title}</div>
      ))}
    </div>
  );
};

export default SearchResults;