graphql-cache-layer

graphql cache layer

[](https://www.npmjs.com/packagenpm i graphql-cache-layer)

Install

npm i --save graphql
npm install --save npm i graphql-cache-layer

Usage

import { StrictMode } from "react";
import ReactDOM from "react-dom";
import {PersistentCacheProvider} from "graphql-cache-layer"
import App from "./App";

const rootElement = document.getElementById("root");
ReactDOM.render(
  <StrictMode>
    <PersistentCacheProvider url="https://api.spacex.land/graphql/">
    <App />
    </PersistentCacheProvider>
  </StrictMode>,
  rootElement
);

import "./styles.css";
import { usePersistentContext } from "graphql-cache-layer";
import {useQuery,gql} from "@apollo/client"

const QUERY = gql`
  query FETCH_DATA {
    launchesPast(limit: 10) {
    mission_name
    launch_date_local
    links {
      article_link
      video_link
    }
    rocket {
      rocket_name
      first_stage {
        cores {
          flight
          core {
            reuse_count
            status
          }
        }
      }
    }
    ships {
      name
      home_port
      image
    }
  }
  }
`

export default function App() {

  const {data} = useQuery(QUERY)

  const persist = usePersistentContext();

  console.log(data)

  return (
    <div className="App">
      <h1>Hello CodeSandbox</h1>
      <h2>Start editing to see some magic happen!</h2>
      <button onClick={() => persist.purge()}>done</button>
    </div>
  );
}

License

MIT ©