Как получить идентификатор нового объекта из мутации?
У меня есть createObject
мутация, которая возвращает идентификатор нового объекта.
После его возвращения я хочу перенаправить на страницу сведений о новом объекте.
Как я могу получить поля ответа от мутации в содержащем компонент, используя реагировать / реле?
Например мой createObject
страница содержит мутацию с кодом вроде:
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
должен быть объект, созданный мутацией, но как мне его достать?
1 ответ
Обычно мы настраиваем клиентскую сторону мутации с RANGE_ADD
и вернуть новый thingEdge
со стороны сервера мутации, но здесь у вас нет диапазона на клиенте для добавления нового узла. Чтобы сказать, что Relay выбирает произвольное поле, используйте REQUIRED_CHILDREN
конфигурации.
Мутация на стороне сервера
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};
},
/* ... */
});
Мутация на стороне клиента
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
}
`],
}];
}
/* ... */
}
Пример использования
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}
);
Обратите внимание, что любые поля, которые вы запрашиваете с помощью этого метода, будут доступны для onSuccess
обратный вызов, но не будет добавлен в хранилище на стороне клиента.