2016-04-18 4 views
2

を使用して:リレー楽観的応答私はそうのように見えるの変異がある場合REQUIRED_CHILDRENの設定

export default class CreateTaskMutation extends Relay.Mutation { 
    //noinspection JSUnusedGlobalSymbols 
    getMutation() { 
     return Relay.QL` 
      mutation { 
       createTaskMutation 
      } 
     `; 
    } 
    //noinspection JSUnusedGlobalSymbols 
    getCollisionKey() { 
     return `check_${this.props.id}`; 
    } 

    //noinspection JSMethodCanBeStatic,JSUnusedGlobalSymbols 
    getFatQuery() { 
     return Relay.QL` 
      fragment on CreateTaskMutationPayload { 
       savedTask { 
        _id, 
        isPublic, 
        isDone, 
        taskDescription { 
         description 
        } 
       } 
      } 
     `; 
    } 

    // noinspection JSUnusedGlobalSymbols 
    getConfigs() { 
     return [{ 
      type: 'REQUIRED_CHILDREN', 
      children: [ 
       Relay.QL` 
        fragment on CreateTaskMutationPayload { 
         savedTask { 
          _id, 
          isPublic, 
          isDone, 
          taskDescription { 
           description 
          } 
         } 
        } 
       ` 
      ] 
     }]; 
    } 

    //noinspection JSUnusedGlobalSymbols 
    getVariables() { 
     return { 
      cookie: this.props.cookie, 
      owner: this.props.owner, 
      taskDescription: this.props.taskDescription, 
      isPublic: this.props.isPublic, 
      isDone: this.props.isDone 
     }; 
    } 

    //noinspection JSUnusedGlobalSymbols 
    getOptimisticResponse() { 
     return { 
      savedTask: { 
       owner: this.props.owner, 
       taskDescription: this.props.taskDescription, 
       isPublic: this.props.isPublic, 
       isDone: this.props.isDone 
      } 
     }; 
    } 
} 

そして、私はそうのようにそれを使用しています:あなたはFIELDS_CHANGEDのような設定を使用する場合、今

Relay.Store.commitUpdate(
    new CreateTaskMutation({ 
     cookie: this.state.cookie, 
     owner: this.state.id, 
     taskDescription: {description: this.state.taskDescriptionInput}, 
     isPublic: this.state.isTaskPublic, 
     isDone: this.state.isTaskDone 
    }), 
    { 
     onSuccess: (response) => { 
      const newArray = this.state.newlyAddedTasks; 
      newArray.push(response.createTaskMutation.savedTask); 
      this.setState({ 
       newlyAddedTasks: newArray 
      }); 
     } 
    } 
); 

を私はthis.props.relay.hasOptimisticUpdates(<some item>)を行うことができましたが、私は リレーの店がまだ知らない何かを作成しているので、それを調べるDataIDはありません。ですから、私の現在の解決策は、タスク、リレーフラグメントレスポンス、成功した場合に更新する状態の2つのソースを使用することです。

<CreateTaskRequestBox 
    tasks={this.props.currentUserFragment.userField.tasks} 
    newTasks={this.state.newlyAddedTasks} 
/> 

私はリレーStoreで楽観的な応答を入れて、それは私がFIELDS_CHANGED設定を使用した場合のように更新されているためにきちんとした方法はありますか?私の現在の解決策は少しばかげているようで、楽観的ではありません。

答えて

2

だから、この突然変異がペイロードを一時的に返すだけでなく、実際にグラフを修正したがっていると思いますか?その後、文書化された変異コンフィギュレーションのいずれかを使用してください。FIELDS_CHANGERANGE_ADDは、ローカルグラフの接続を変更し、それに応じてビューを更新します。あなたがそれを使用している理由... :)

FIELDS_CHANGEを使用するには、あなたのペイロードを更新し、REQUIRED_CHILDRENは実際に地元のグラフに影響を与えるべきではない変異のため明示的ないが、そのために文書化されていない私はわかりません親ノードを含めるには(あなたのケースではuserFieldのように見えます)、ちょうどuserField { tasks }の太ったクエリを実行します。

RANGE_ADDを使用するには、新しいタスクエッジ(例:savedTaskEdge { cursor, node })を含めるようにペイロードを更新し、それを突然変異設定で参照します。

+0

REQUIRED_CHILDRENのドキュメントはこちらです:https://facebook.github.io/relay/docs/guides-mutations.html – sboutzen

+1

ああ、それはドキュメントに追加されています。とにかく、それはあなたがやっていることを意味していません: "REQUIRED_CHILDREN設定の結果として取り出されたデータはクライアントストアに書き込まれません" – NevilleS

+0

うん、私はそれを理解しています。 – sboutzen