ゆるふわ技術日誌

エンジニア見習いの悪戦苦闘日記

apollo-link-stateの公式ドキュメントのresolver付近を雑に途中まで訳した記事

コード読んだり書いたりしててもいまいちパッとしないのでちゃんとドキュメントを読んでその上で書くことに。

以下要点と思うところの超ざっくりとした日本語訳。

www.apollographql.com

apollo-link-stateで使うresolverを書くときに守るべきこと

  1. キャッシュはcontextに追加される(resolverの第3引数)。なのでデータの読み書きをキャッシュから行うことができる
  2. resolverはtypenameを使わないためにdataIdFronObject関数をオーバーライドしたりしてない限りはtypenameプロパティを含んだオブジェクトを返すべき。これはApollo Clientがデータをキャッシュの中でノーマライズするのに必要。
  3. resolverは非同期の副作用が必要な場合はpromiseを返すことができる
  4. Queryのresolverはキャッシュミスの時だけ呼ぶ。最初に呼んだときにはdefault stateを返すべき。

多分こんな感じ。英語が怪しくて辛い。よくわからんくても最後まで読めばわかるよ、と書いてるので読む。

Default resolvers

すべてのフィールドについてresolverを書かなくてよい。もし親オブジェクトがリクエストしたものと同じ名前のフィールドを持っていたらresolverを指定する必要はない。

const getUser = gql`
  query {
    user(id: 1) @client {
      name {
        last
        first
      }
    }
  }
`;

このQueryの場合はQuery.userをresolver mapに作成する必要がある。もしQuery.userがlastとfirstというプロパティを持つnameオブジェクトを返すならResolver書かないであとはよしなにやってくれる。

Resolver signature

resolver functionはgraphql-toolsで作られたサーバーと全く同じシグネチャだよん。4つパラメータあるンゴ。

fieldName: (obj, args, context, info) => result;

obj: 親フィールドのresolverが返した値かトップレベルquery/mutationの場合はROOT_QUERYオブジェクト。apollo-link-stateにはtoo muchだからご心配なく〜と書いてる。

args: 引数。updateNetworkStatus(isConnected: true)を渡すとargsには{ isConnected: true }が入る。

context: コンテキスト。全てのApollo Link chainで共有される。もっとも重要なのはコンテキストにはApollo cacheが追加されるということ。なので、cache.writeDate({})でキャッシュを操作できる。コンテキストに値を追加したかったらこれapollo-link-contextを使ってな。

info: queryの実行についての情報が入っている。多分使わんよ。(とドキュメントに書いてる)


この先もご丁寧に訳そうかと思っていたがこの辺まで読んだところで公式のexampleの内容がわかるようになったので中断してコード書いてみていた。

github.com

↑まだ途中なのでただのゴミ

Todo作ってもしゃあないかなと思ったので複数個counterが作れるcounterアプリみたいな訳のわからないものを作ることにした。まぁ例なんてなんでもええんや。

雑談

ため息エクストリーム便。送料無料。