0

我目前正在从事一个需要我进行多个查询/突变的项目。我尝试使用 BatchHttpLink 设置我的 apollo 客户端，我可以在浏览器的网络选项卡中看到我请求的数据。它返回的是对象数组而不是 JSON。

但问题是当我尝试获取组件数据中的数据时未定义。我尝试使用 HttpLink 而不是 BatchHttpLink，我可以从钩子中取回数据。

我怀疑从响应中返回的对象的形状不同，我尝试查看文档，但找不到太多关于批处理的信息。

目前使用"@apollo/client@^3.0.2"

这是我的客户端设置。

import { ApolloClient, InMemoryCache, ApolloLink, from } from '@apollo/client'
import { BatchHttpLink } from '@apollo/client/link/batch-http'
import { onError } from '@apollo/client/link/error'

const BASE_URL = 'http://localhost:4000'
const httpLink = new BatchHttpLink({
  uri: BASE_URL,
  credentials: 'include',
})
const csrfMiddleware = new ApolloLink((operation, forward) => {
  operation.setContext(({ headers = {} }) => ({
    headers: {
      ...headers,
      'X-CSRF-Token': getCSRFToken(),
    },
  }))
  return forward(operation)
})
const errorMiddleware = onError(({ networkError }) => {
  if (networkError && 'statusCode' in networkError && networkError.statusCode === 401) {
    window.location.assign('/accounts/login')
  }
})
const client = new ApolloClient({
  link: from([errorMiddleware, csrfMiddleware, httpLink]),
  cache: new InMemoryCache(),
})

这是我试图控制日志的反应钩子。

const {data} = useQuery(GET_USER_PERMISSIONS_AND_PREFERENCES)
4

2 回答 2

0

弄清楚了。您需要添加另一个中间件来返回 useQuery 挂钩可以识别的数据。批处理调用中返回的数据是一组对象形状

{ 
  payload: {
    data: { ... }
  }
}

所以像这样的东西对我有用

const batchParseMiddleware = new ApolloLink((operation, forward) => {
  return forward(operation).map((data: any) => data.payload)
})
于 2020-07-24T14:39:54.837 回答
0

我一直有类似的问题，到目前为止只能通过中断批处理并转换为普通的 HttpLink 来解决它

于 2021-04-30T05:33:53.697 回答