带参数的阿波罗客户端查询 - Vue答案

【问题标题】：apollo client query with params - Vue带参数的阿波罗客户端查询 - Vue
【发布时间】：2020-07-26 10:45:51
【问题描述】：

Apollo 客户端的查询：

apolloClient
  .query({
    query: authQuery,
    variables: {
      login: payload.login,
      password: payload.password,
    },
  })
  .then((res) => console.log(res)

authQuery 的内容（在 file.gql 中）：

query auth {
  data
}

我总是得到以下响应：

{
  data: null
  loading: false
  networkStatus: 7
  stale: true
}

虽然在 graphiQL 中我得到了正确的响应：

在 GraphiQL 中查询

{
  auth(login:"root@admin", password:"1234")
}

然后回应：

{
  "data": {
    "auth": "eyJhbGciOi8"
  }
}

我怀疑我的 file.gql 是罪魁祸首？或者查询中的变量没有被读取？

【问题讨论】：

您的查询不包含任何变量？
您可以在我的.query 中看到variables

标签： vue.js graphql apollo-client

【解决方案1】：

我必须以这种方式包装我的查询：

query Auth($login: String!, $password: String!) {
  auth (login: $login, password: $password)
}

当您在查询中使用参数时，您总是必须以这种方式包装它。

【讨论】：