次の突然変異を行った後にリレーが更新されない

Question

現在、リレーのモダンで突然変異を起こしている問題を見つけました。我々は、多くのエントリを含む日記を持っています。ユーザーが日記のある日にエントリを追加するたびに、エントリを作成する前に日記を作成します。すべてが期待通りに機能しますが、UIは突然変異の直後には更新されません。ここにコードがあります。

AddDiaryMutation

import { commitMutation, graphql } from 'react-relay'; 

const mutation = graphql` 
mutation AddDiaryMutation($input: AddDiaryInput!) { 
    createDiary(input: $input) { 
    diary { 
     id 
     ...EntryList_entries 
    } 
    } 
} 
`; 

let clientMutationId = 0; 

const commit = (environment, { date }, callback) => 
commitMutation(environment, { 
    mutation, 
    variables: { 
     input: { 
     date, 
     clientMutationId: clientMutationId++ 
     } 
    }, 
    onCompleted: response => { 
    const id = response.createDiary.diary.id; 
    callback(id); 
    } 
}); 

export default { commit }; 

AddEntryMutationは、エントリを追加するAddDiaryMutation応答からIDを取得します。

import { commitMutation, graphql } from 'react-relay'; 
import { ConnectionHandler } from 'relay-runtime'; 

const mutation = graphql` 
mutation AddEntryMutation($input: AddEntryInput!) { 
    createEntry(input: $input) { 
    entryEdge { 
     node { 
     id 
     project { 
      name 
     } 
     speaker { 
      name 
     } 
     } 
     } 
    } 
    } 
    `; 

function sharedUpdater(store, diaryId, newEdge) { 
    const diaryProxy = store.get(diaryId); 
    const conn = ConnectionHandler.getConnection(diaryProxy, 
     'EntryList_entries'); 
    ConnectionHandler.insertEdgeAfter(conn, newEdge); 
} 

let clientMutationId = 0; 

    const commit = (environment, { diaryId, ...rest }, callback) => 
    commitMutation(environment, { 
     mutation, 
     variables: { 
     input: { 
      ...rest, 
      clientMutationId: clientMutationId++ 
     } 
     }, 
     updater: store => { 
      const payload = store.getRootField('createEntry'); 
      const newEdge = payload.getLinkedRecord('entryEdge'); 
      sharedUpdater(store, diaryId, newEdge); 
     }, 
     onCompleted:() => callback() 
}); 

export default { commit }; 

するentrylistフラグメント

fragment EntryList_entries on Diary { 
    entries(first: 20) @connection(key: "EntryList_entries", filters: []) 
{ 
    edges { 
     node { 
     ...Entry_entry 
     } 
    } 
    } 
} 

エントリフラグメント

fragment Entry_entry on Entry { 
    id 
    project { 
    name 
    } 
    speaker { 
    name 
    } 
} 

Answer 1

私はまた、このアップデータの問題を持っていました。私はすべての変数にconsole.logを推奨し、チェーンがどこでブレーキをかけているかを確認します。私は私のgetConnectionメソッド（と私はまた、エッジを含むように私のスキーマを変更している）に問題があります。環境内のストアにコンソールログを記録して、そこのレコードを確認することもできます。