getOptimisticResponse對於帶參數的字段不起作用

Question

以下是我的用於從組中添加和刪除某人的代碼。

由於某種原因，getOptimisticResponse不適用於此突變。

難道這是由於有一個參數groupId爲isInGroup字段？

class GroupAddRemovePersonMutation extends Relay.Mutation { 
    static initialVariables = { 
    groupId: null, 
    } 

    static prepareVariables(prevVars) { 
    return prevVars; 
    } 

    static fragments = { 
    person:() => Relay.QL` 
     fragment on Person { 
     id 
     isInGroup(groupId: $groupId) 
     } 
    `, 
    } 

    getMutation() { 
    return this.props.isInGroup ? 
     Relay.QL`mutation { groupRemovePerson }` : 
     Relay.QL`mutation { groupAddPerson }`; 
    } 

    getVariables() { 
    const {groupId, person} = this.props; 
    return { 
     personId: person.id, 
     groupId, 
    }; 
    } 

    getCollisionKey() { 
    const {groupId, person} = this.props; 
    return `groupPerson_${groupId}_${person.id}`; 
    } 

    getFatQuery() { 
    const {groupId, person, isInGroup} = this.props; 
    return isInGroup ? 
     Relay.QL` 
     fragment on GroupRemovePersonMutationPayload { 
      person { 
      id 
      groups { id } 
      isInGroup(groupId: "${groupId}") 
      } 
      group { 
      id 
      person 
      hasPerson(personId: "${person.id}") 
      } 
     } 
     ` : 
     Relay.QL` 
     fragment on GroupAddPersonMutationPayload { 
      person { 
      id 
      groups { id } 
      isInGroup(groupId: "${groupId}") 
      } 
      group { 
      id 
      person 
      hasPerson(personId: "${person.id}") 
      } 
     } 
     `; 
    } 

    getConfigs() { 
    const {groupId, person} = this.props; 
    return [{ 
     type: 'FIELDS_CHANGE', 
     fieldIDs: { 
     person: person.id, 
     group: groupId, 
     }, 
    }]; 
    } 

    getOptimisticResponse() { 
    const {groupId, person, isInGroup} = this.props; 
    return { 
     person: { 
     id: person.id, 
     isInGroup: !isInGroup, 
     }, 
     group: { 
     id: groupId, 
     hasPerson: !isInGroup, 
     }, 
    }; 
    } 
} 

Answer 1

我會嘗試首先將groupId添加到樂觀響應。根據我的經驗，樂觀的迴應必須完全匹配胖查詢的形狀。

如果您在生成樂觀響應時沒有groupIds，則可以嘗試替換臨時值，直到從服務器返回響應。當您呈現連接併爲視圖提供鍵以區分重複的React元素時，通常會出現此情形。