Question

我在将变量选项传递给graphql查询时遇到问题。如果console.log（ownProps.match.params.id）我得到正确的id。

但是我得到了这个错误：

错误：操作＆＃39; selectCustomer＆＃39;包装＆＃39; Apollo（Apollo（withRouter（消费者）））＆＃39;期待一个变量：＆＃39; id＆＃39;但是在传递给阿波罗的道具中没有找到（阿波罗（阿波罗（带路透社）））＃39;

导出

const ConsumerWithMutations =  graphql(selectCustomer, {
  name : 'selectCustomer',
  options: (ownProps) => ({
    variables: {
      id: ownProps.match.params.id
    }
  })
})(graphql(deleteCustomer, {
  name: 'deleteCustomer'
})(withRouter(Consumer)))

export default graphql(selectCustomer)(ConsumerWithMutations);

查询

const selectCustomer = gql`
query selectCustomer($id: String!)
{
  consumer(id: $id) {
    id
    firstname
    lastname
    dateOfBirth
    ...

Answer 1

您尝试使用相同的查询HOC包装您的组件两次 - 第一次在您的ConsumerWithMutations定义内，然后再次在您的导出语句中。

您未在导出声明中将任何选项传递到HOC，因此您的selectCustomer查询无法找到您指定的id变量，这就是您看到的原因你得到的错误。

将导出语句修改为：

export default ConsumerWithMutations;

它应该有用。

我还强烈建议您在使用此类多个HOC时使用compose - 它有助于保持代码可读性。查看示例here。

使用react-apollo将变量传递给graphql查询

1 个答案: