RANGE_ADD 配置中指定的任何 rangeBehaviors 都不匹配答案

【问题标题】：No match on any of the rangeBehaviors specified in RANGE_ADD configRANGE_ADD 配置中指定的任何 rangeBehaviors 都不匹配
【发布时间】：2016-08-20 01:36:01
【问题描述】：

我有以下突变：

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 警告：RelayMutation：突变字段 classroom 上与 ID Classroom:35 对应的连接 taskList{hasNewMessages:true,member_id:null} 与您的 RANGE_ADD 配置中指定的任何 rangeBehaviors 都不匹配。这意味着将重新获取整个连接。为此突变配置范围行为，以便仅获取新边缘并启用乐观突变或使用refetch 消除此警告。

和

warning.js:44 警告：不推荐使用 null 作为 rangeBehavior 值。使用ignore 避免重新获取范围。

由于另一个 rangeBehaviors 工作，我假设在一个行为中声明 2 个变量时一定存在语法错误 - 在本例中为 hasNewMessages 和 memeber_id。

我已经为此寻找答案，但我找不到任何答案。文档似乎也没有涵盖这种极端情况。

编辑：我也试过rangeBehaviors['hasNewMessages(true),member_id(null)'] = 'ignore';（逗号作为分隔符）但没有成功。

【问题讨论】：

标签： reactjs graphql relayjs

【解决方案1】：

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

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

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

例如：

右：

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

错误：

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

【讨论】：