react-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不支持使用标准react-apolloAPI 支持这种动态查询生成.那是因为我们坚信使用静态查询比在运行时生成字段要好得多:https : //dev-blog.apollodata.com/5-benefits-of-static-graphql-queries-b7fa90b0b69a#.hp710vxe7

但是,鉴于这种情况,听起来像动态生成突变字符串是一个不错的选择.您可以直接使用Apollo而不是通过graphqlHoC 来完成此操作.您可以使用withApolloHoC执行此操作: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 - 当标准的东西还不够时.

以下是mutatebtw 的文档:http://dev.apollodata.com/core/apollo-client-api.html#ApolloClient.mutate