2016-10-18 3 views
1

react-apollo HOC graphqlを使用すると、componentWillReceivePropsでクエリの実行を何とか無効にすることはできますか?私が何をしようとしているのかを説明する。react-apolloでcomponentWillReceivePropsライフサイクルのクエリ実行を無効にするにはどうすればよいですか?

私は、URLに基​​づいて写真の詳細ページとアルバムの写真を開く予定のルート/:albumSlug/photos/:photoIdを持っています。このページでは、photoIdでこの写真の前後に10枚の写真を取り込みます。今度はユーザーが次の写真に移動すると、5枚以上の写真がプリロードされているかどうかを確認し、もしそうならば、この質問をスキップします。fetchMore写真を照会してデータを併合します。

問題は、グラフのHOCを使用すると、すべてcomponentWillReceivePropsの単一のクエリが発生するということです。何とかそれを無効にすることは可能ですか?または他の解決策?

私が出てきた解決策は、このスキップ状態を処理し、クエリオプションでskipオプションを使用する単純なコンポーネントにgraphqlで返されたコンポーネントをラップすることでしたが、どういうわけか本当にこの解決策が気に入らないのです。

UPDATE: まあ、それは単なるアイデアですが、クエリは次のようになります。

album(id: $albumId) { 
    current:photoById(id: $photoId) { 
    ...photo 
    } 
    previous: photos(before: $photoId, limit: 10) { 
    ...photo 
    } 
    next: photos(after: $photoId, limit: 10) { 
    ...photo 
    } 
} 

私は、このように小道具のマッピングを使用しています:内の配列にそれを変換するために

photos: [...album.previous, album.current, ...album.next] 

私は写真を見つけることができます。私はナビゲーションをレンダリングするためにもこれを使用し、私の考えはfetchMore関数を使用してこのページにマージすることでした。それが動作するかどうかわからない私は少し実験している。

+0

'noFetch'オプションを使用すると、データがキャッシュからのみロードされ、サーバーにヒットしないようにすることができます。クエリをロードする必要があるかどうかを判断する方法を正確に把握しているかどうかはわかりませんが、詳細を教えてください。 – stubailo

+0

@stubailoコメントを追加しました、私はそれが私のアイデアを少しずつexaplinしてくれることを願っています –

答えて

0

Apollo 1.0 RCでは、FetchPolicyを使用できます。

関連する問題