Документ динамической мутации для реакции-apollo

Question

Мне нужно динамически изменить мой файл мутации, чтобы иметь возможность создавать несколько элементов в одной мутации. Поэтому у меня есть эта функция createOrderName, которая берет целое число и может создать правильный мутационный документ. Например. createOrderName(2) получает

mutation createOrderMut($input0: AddToOrderMenuItemConnectionInput!, $input1: AddToOrderMenuItemConnectionInput!) { 
    input0: addToOrderMenuItemConnection (input:$input0) { 
    changedOrderMenuItem { 
     id 
    } 
    } 
    input1: addToOrderMenuItemConnection (input:$input1) { 
    changedOrderMenuItem { 
     id 
    } 
    } 
} 

И мой контейнер выглядит следующим образом.

const CartContainer = compose(
    graphql(createOrderName(2), { 
    props: ({ mutate }) => ({ 
     addToOrderMenuItem: (menus, orderId) => mutate({ 
     variables: createOrdersInput(menus, orderId) 
     }) 
    }) 
    }) 
)(CartView) 

Как я могу передать целочисленное значение этой мутации, чтобы создать правильный мутационный документ? В настоящее время это исправление до 2, но мне нужно, чтобы он был более гибким, поэтому я могу создать любое количество элементов ...

Answer 1

Это звучит как неудачное ограничение бэкэнда, с которым вы работаете. Правильный способ выполнения пакетной мутации состоял бы в том, чтобы на сервере было одно поле мутации, которое принимает аргумент списка со всеми элементами, которые вы хотите вставить. Таким образом, Apollo не предназначен для поддержки создания таких динамических запросов со стандартным API react-apollo. Это связано с тем, что мы твердо убеждены в том, что работа со статическими запросами намного лучше, чем генерация полей во время выполнения: https://dev-blog.apollodata.com/5-benefits-of-static-graphql-queries-b7fa90b0b69a#.hp710vxe7

Учитывая, что эта ситуация звучит как генерация, динамическая последовательность мутаций является хорошим вариантом. Вы можете сделать это, используя Apollo напрямую, а не через graphql HoC. Вы можете использовать withApollo Hoc, чтобы сделать это: http://dev.apollodata.com/react/higher-order-components.html#withApollo

import { withApollo } from 'react-apollo'; 

const MyComponent = ({ client }) => { 
    function mutate() { 
    const dynamicMutationString = // generate mutation string here 

    client.mutate({ 
     mutation: gql`${dynamicMutationString}`, 
     variables: { ... }, 
    }).then(...); 
    } 

    return <button onClick={mutate}>Click here</button>; 
} 

const MyComponentWithApollo = withApollo(MyComponent); 

Мы построили этот дополнительный API только для этой цели - когда стандартный материал не достаточно.

Вот документы для mutate КСТАТИ: http://dev.apollodata.com/core/apollo-client-api.html#ApolloClient.mutate

Answer 2

Я не уверен, могу ли я ответить на ваш вопрос с вашей текущей реализацией, поэтому я собираюсь попросить вас переосмыслить определение мутации и использовать GraphQLList и GraphQLInputObject.

Таким образом, в зависимости от полей, которые вы должны мутировать:

args: { 
    input: { 
    type: new GraphQLList(new GraphQLInputObjectType({ 
     name: 'inputObject', 
     description: 'Your description here', 
     fields: { 
     id: { type: GraphQLInt } 
     }, 
    })), 
    }, 
}, 

Таким образом, вы можете предоставить п-количество объектов в ваш мутировать вызов, и получить список обратно на ваш тип:

{ 
    mutation myMutation { 
    addToOrderMenuItemConnection(input: [{ id: 123 }, { id: 456 }]) { 
     id 
    } 
    } 
} 

Опять же, я не на 100% знаком с вашей конечной целью, но я думаю, что это даст вам гибкость для будущих изменений/обновлений, так как вы имеете дело с вводом объекта, а не с отдельными аргументами, что также (надеюсь) изолируют вас от будущих изменений.