如何从突变中获取新对象的 ID? [英] How to get the ID of a new object from a mutation?

问题描述

我有一个 createObject 变异，它返回新对象的 ID.

它返回后，我想重定向到有关新对象的详细信息页面.

如何使用 react/relay 从包含组件的突变中获取响应字段?

例如我的 createObject 页面包含带有如下代码的突变:

var onFailure = (transaction) =>{};var onSuccess = () =>{redirectTo('/thing/${newthing.id}');//我怎样才能得到这个 ID?};//要执行更改，请将 1 的实例传递给 `Relay.Store.update`Relay.Store.update(new AddThingMutation({userId: this.props.userId,标题:this.refs.title.value，}), { onFailure, onSuccess });}

newthing 应该是变异创建的对象，但是我怎么才能拿到呢?

解决方案

通常我们会使用 RANGE_ADD 配置突变的客户端，并从突变的服务器端，但在这里您没有客户端上的范围来添加新节点.要告诉 Relay 获取任意字段，请使用 REQUIRED_CHILDREN 配置.

服务端变异

var AddThingMutation = mutationWithClientMutationId({/* ... */输出字段:{新事物 ID:{类型:GraphQLID，//第一个参数:变异后的 'payload'解决:({thing}) =>东西.id,},},mutateAndGetPayload: ({userId, title}) =>{var thing = createThing(userId, title);//在这里返回有效载荷"返回{东西}；},/* ... */});

客户端突变

class AddThingMutation extends Relay.Mutation {/* ... */获取配置(){返回 [{类型:'REQUIRED_CHILDREN'，//强制将这些片段包含在查询中孩子们:[Relay.QL`AddThingPayload 上的片段{新事物ID}`]，}];}/* ... */}

示例用法

var onFailure = (transaction) =>{//...};var onSuccess = (响应) =>{var {newThingId} = response.addThing;redirectTo(`/thing/${newThingId}`);};Relay.Store.update(新的 AddThingMutation({标题:this.refs.title.value，userId: this.props.userId,}),{成功，失败});

请注意，您使用此技术查询的任何字段都将可用于 onSuccess 回调，但不会添加到客户端存储中.>

I have a createObject mutation that returns the ID of the new object.

After it returns I want to redirect to a detail page about the new object.

How can I get response fields from a mutation in the containing component using react/relay?

E.g. my createObject page contains the mutation with code like:

var onFailure = (transaction) => {

};

var onSuccess = () => {
  redirectTo('/thing/${newthing.id}');   // how can I get this ID?
};

// To perform a mutation, pass an instance of one to `Relay.Store.update`
Relay.Store.update(new AddThingMutation({
  userId: this.props.userId,
  title: this.refs.title.value,
}), { onFailure, onSuccess });
}

newthing should be the object created by the mutation, but how can I get hold of it?

解决方案

Normally we would configure the client-side of the mutation with RANGE_ADD and return a new thingEdge from the server side of the mutation, but here you don't have a range on the client to add the new node to. To tell Relay to fetch an arbitrary field, use the REQUIRED_CHILDREN config.

Server side mutation

var AddThingMutation = mutationWithClientMutationId({
  /* ... */
  outputFields: {
    newThingId: {
      type: GraphQLID,
      // First argument: post-mutation 'payload'
      resolve: ({thing}) => thing.id,
    },
  },
  mutateAndGetPayload: ({userId, title}) => {
    var thing = createThing(userId, title);
    // Return the 'payload' here
    return {thing};
  },
  /* ... */
});

Client side mutation

class AddThingMutation extends Relay.Mutation {
  /* ... */
  getConfigs() {
    return [{
      type: 'REQUIRED_CHILDREN',
      // Forces these fragments to be included in the query
      children: [Relay.QL`
        fragment on AddThingPayload {
          newThingId
        }
      `],
    }];
  }
  /* ... */
}

Example usage

var onFailure = (transaction) => {
  // ...
};

var onSuccess = (response) => {
  var {newThingId} = response.addThing;
  redirectTo(`/thing/${newThingId}`);
};

Relay.Store.update(
  new AddThingMutation({
    title: this.refs.title.value,
    userId: this.props.userId,
  }), 
  {onSuccess, onFailure}
);

Note that any fields you query for by using this technique will be made available to the onSuccess callback, but will not be added to the client side store.

这篇关于如何从突变中获取新对象的 ID?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！