问题描述
我有一个 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?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!