reactjs - RANGE_ADD 配置中指定的任何 rangeBehaviors 均不匹配

Question

我有以下突变:

export default class AddTaskMutation extends Relay.Mutation {
  static fragments = {
    classroom: () => Relay.QL`
      fragment on Classroom {
        id,
      }`,
  };

  getMutation() {
    return Relay.QL`mutation { addTask }`;
  }

  getFatQuery() {
    return Relay.QL`
      fragment on AddTaskPayload {
        classroom {
          taskList,
        },
        taskEdge,
      }
    `;
  }

  getConfigs() {    
    let rangeBehaviors = {};
    let member_id = 'hasNewMessages(true) member_id(' + Global.fromGlobalId(this.props.createdByMember)['id'] + ')';
    rangeBehaviors[''] = 'append';
    rangeBehaviors['hasToDo(true)'] = 'append';
    rangeBehaviors['hasToDo(false)'] = 'append';
    rangeBehaviors['isStart(true)'] = 'ignore';
    rangeBehaviors['isStart(false)'] = 'append';
    rangeBehaviors[`${member_id}`] = 'append';
    rangeBehaviors['hasNewMessages(true) member_id(null)'] = 'ignore';
    return [
      {
        type: 'RANGE_ADD',
        parentName: 'classroom',
        parentID: this.props.classroomId,
        connectionName: 'taskList',
        edgeName: 'taskEdge',
        rangeBehaviors,
      }
    ];
  }

  getVariables() {
    return {
      title: this.props.title,
      instruction: this.props.instruction,
      start_date: this.props.start_date,
      end_date: this.props.end_date,
      is_archived: this.props.is_archived,
      is_published: this.props.is_published,
      is_preview: this.props.is_preview,
      productId: this.props.productId,
      classroomId: this.props.classroomId,
      createdByMember: this.props.createdByMember,
      subTasks: this.props.subTasks,
      students: this.props.students,
    };
  }
}

运行我的应用程序时，我收到以下 2 个警告:

warning.js:44 Warning: RelayMutation: The connection taskList{hasNewMessages:true,member_id:null} on the mutation field classroom that corresponds to the ID Classroom:35 did not match any of the rangeBehaviors specified in your RANGE_ADD config. This means that the entire connection will be refetched. Configure a range behavior for this mutation in order to fetch only the new edge and to enable optimistic mutations or use refetch to squelch this warning.

和

warning.js:44 Warning: Using null as a rangeBehavior value is deprecated. Use ignore to avoid refetching a range.

由于其他 rangeBehaviors 有效，我认为在一个行为中声明 2 个变量时一定存在语法错误 - 在本例中为 hasNewMessages 和 memeber_id.

我一直在寻找这个问题的答案，但我找不到任何答案。这些文档似乎也没有涵盖这种边缘情况。

编辑:我还尝试了 rangeBehaviors['hasNewMessages(true),member_id(null)'] = 'ignore'; (逗号作为分隔符)，但没有成功。

Answer 1

检查 Relay 的源代码(文件 RelayMutationQuery.js)后，我可以看到它在所有 rangeBehaviors 的数组中搜索什么数组键。然后我可以将代码更新为正确的格式。

由于我在网上没有找到任何有关此边缘情况的信息，因此我将在此处发布我的解决方案 - 也许将来有人会发现它很有帮助。

<小时/>

当 rangeBehavior 有 2 个(或更多)变量时，您需要用句点 (.) 分隔它们。另外，当传递 null 时，您不会显式传递它 - 只需从其变量中省略它即可。

例如:

右:

rangeBehaviors['hasNewMessages(true).member_id()'] = 'ignore';

错误:

rangeBehaviors['hasNewMessages(true),member_id(null)'] = 'ignore';