並べ替えられた接続に対して楽観的な応答を作成する

Question

RelayJSで接続を「並べ替える」最良の方法は何ですか？

私のユーザーインターフェイスでは、私は2つの項目を「スワップ」することができますが、その周りに突然変異を作成するのはちょっと難しいです。

私が今やっていることは素朴な方法です。すなわち、FIELDS_CHANGEを使ってノード自体を変更してください。

これはうまくいきますが、問題は楽観的な更新を書くことができないようです。私はidsのリストを私のgraphqlサーバーに渡すことはできますが、実際のデータが必要なので、楽観的な更新では機能しません。

私は私の '接続'インターフェースを模倣しなければならないと思いますが、残念ながらまだ動作しません。並べ替えられたノードをgetOptimisticResponseにコピーしましたが、無視されるようです。データは実際のサーバー応答と一致します。 （IDS簡体字）

元

：

{ 
    item: { 
    edges: { 
     {cursor: 1, node: {id:2}} 
     {cursor: 2, node: {id:1}} 
    } 
    } 
} 

（何もしない）： 楽観REPONSE：

{ 
    item: { 
    edges: { 
     node: {id:1} 
     node: {id:2} 
    } 
    } 
} 

サーバーREPONSE：

{ 
    item: { 
    edges: { 
     {cursor: 1, node: {id:1}} 
     {cursor: 2, node: {id:2}} 
    } 
    } 
} 

できますか？これは同等です（カーソルを除く）、カーソルを追加してもまだ動作しません。

私は間違っていますか？また、私のIDをコネクションに偽装する簡単な方法がありますか？

また、別として、このデータを少しずつ得る方法はありますか？今、2つのアイテムを並べ替えると、私の変異の設定のためにリスト全体が再要求されます。私はRANGE_ADDとRANGE_DELETEを使って 'スワップをシミュレートする'ことができると思いますが、これを行う簡単な方法はありますか？

Answer 1

あなたがアイテムの並べ替えに応答して突然変異を引き起こすので、私はあなたがアイテムの位置または順序をサーバ側に保存すると仮定します。あなたがしていることに対して、楽観的な反応を生み出す方法の1つは、positionまたはorderの情報を使用することです。サーバー側では、項目に追加フィールドpositionを提供する必要があります。クライアント側では、表示される項目はpositionでソートされます。

ユーザーが2つのアイテムを交換するとき、クライアント側の突然変異の楽観的な反応では、これら2つの項目のpositionフィールドを交換するだけで済みます。同じことがサーバーサイドの突然変異にも当てはまります。

楽観的応答コードは次のようにすることができ

：

getOptimisticResponse() { 
    return { 
    item1: { 
     id: this.props.item1.id, 
     position: this.props.item2.position, 
    }, 
    item2: { 
     id: this.props.item2.id, 
     position: this.props.item1.position, 
    }, 
    }; 
}