削除突然変異のための楽観的な更新

Question

私は削除突然変異を書いています。変異がKeyノードを削除し、viewerのkeysコレクション（私はリレー形式のコレクションを使用しています更新する必要があります。viewer { keys(first: 3) { edges { node { ... }}}}を

にアドバイスhere後、私は簡単にするためにFIELDS_CHANGE設定を使用していて、それが実際に働いています：？。

export class DeleteKeyMutation extends Relay.Mutation { 
    static fragments = { 
    viewer:() => Relay.QL` 
     fragment on Viewer { id } 
    `, 
    }; 
    getMutation() { return Relay.QL`mutation {deleteKey}`; } 
    getVariables() { 
    return { 
     id: this.props.id, 
    }; 
    } 
    getFatQuery() { 
    return Relay.QL` 
     fragment on DeleteKeyPayload { 
     viewer { keys } 
     } 
    `; 
    } 
    getConfigs() { 
    return [ 
     { 
     type: 'FIELDS_CHANGE', 
     fieldIDs: { 
      viewer: this.props.viewer.id, 
     }, 
     }, 
    ]; 
    } 
} 

は今、私はこのために楽観的変異を書く必要がありますどのように私は別のアプローチを試してみたが、どれも働いたリレーで

Answer 1

楽観更新はサーバーがreturどうなるかだけのシミュレーションです操作が成功するとn。あなたのケースでは、1つのキーを削除しています。その結果、そのキーがないオブジェクトになります。

getOptimisticUpdate() { 
    return { 
    viewer: { 
     id: this.props.viewer.id, 
     keys: { 
     edges: this.props.viewer.keys.edges.filter((keyEdge) => key.node.id !== this.props.id) 
     } 
    } 
    }; 
} 

突然変異で利用できるようにフラグメントにキーを含める必要もあります。

static fragments = { 
    viewer:() => Relay.QL` 
    fragment on Viewer { id, keys { edges(first: 3) { node { id } }} 
    `, 
}; 

このアプローチの問題は、あなたの現在のキーページングが何であるかを知るために突然変異に依存していることです。一度にConnection全体を操作している場合は問題ありませんが、リレーページネーションを使用している場合は、他の突然変異操作の使用を検討する必要があります。

NODE_DELETEがあります。これにより、リレーストアからキーがすべて削除されたり、RANGE_DELETEを使用して現在の接続からキーを削除することができます。