2016-12-28 5 views
4

タスクのリストを特定の順序で表示したいと思います。問題は、ユーザーが注文を変更し、graphqlに保存しておく必要があるということです(ユーザーはリストにタスクを追加したり削除することもできます)。現在、リレー接続としてリストを実装しており、追加/削除/更新は正常に動作しています。今考えているのは次のとおりです。graphql/relayで順序付きリストを維持する

  • graphqlで順序付きリストを返します。次に、そのリストをコンポーネント内のローカル状態にコピーし、そこでリストを並べ替えます。その後、変更についてgraphqlに通知してください。
  • graphqlはソート順であるすべてのタスクの番号を返します。
  • graphqlがリンクリストを返すようにします。だから、すべてのタスクは、リストの次のものへの参照を持っています。

私はそれを見ると、それぞれにいくつかの問題があります。順序付きリストを使用してそれをローカル状態にコピーすると、何らかの動作の追加と削除を処理し、それに応じてローカル状態を更新する必要があります。

番号のソート順で、実行中の番号を使用すると、 1..2..3 ..番号200を番号1と2の間で移動したいときは、多くの番号を更新する必要があります。これは多くの更新のようですが、これがどのようにリレー/ graphql。

リンクされたリストには、注文の変更に伴う多くの簿記もあります。これがどのようにリレーの変異で処理されるのかわかりません。おそらく、突然変異(ポインタをリストの次のものに変更したすべてのタスク)から3つのタスクを返し、 "FIELDS_CHANGE"設定でそのタスクを指定しますか?

relay/graphql/reactを使用するときに最適な解決策はどれですか?その他のソリューションは大歓迎です。

答えて

1

我々は別のものに関連した項目を移動するための別の変異を作成するために、パスを下って行った:

  • 一般getクエリがアイテムを移動する任意のorderキーまたはそのよう
  • せずに順序付けられたリストを返します。 moveBeforeまたはmoveAfterの突然変異によって行われ、新しくソートされたリストが返されます。引数は新しいitemToMoverelativeTargetです。

突然変異のための署名はおよそ次のようになります。アイテムを移動する

moveAfter(itemToMove: ID!, itemToMoveAfter: ID!): Item[]

他の項目は同じシグネチャ&振る舞いを持って前に、単にサーバー側のロジックは少し異なっています。

リレーを使用していないので、リレーに変更を認識させる方法についてはコメントできません。

関連する問題