React Apollo graphql HOC 加载为假但没有数据字段

Posted 2023-03-08

【中文标题】React Apollo graphql HOC 加载为假但没有数据字段

【英文标题】：React Apollo graphql HOC loading is false but no data field

【发布时间】：2019-12-06 18:38:43

【问题描述】：

我正在尝试将数据存储在 apollo 缓存中，并通过 graphql HOC 在我的组件中获取这些数据

这里我初始化 Apollo Client 并将用户数据添加到 apollo 缓存中：

const cache = new InMemoryCache();

const client = new ApolloClient(
  cache,
  resolvers: 
);
cache.writeQuery(
  query: GET_CURRENT_USER,
  data: 
    userData: 
      id: 1,
      name: "Alexander",
      email: "[e-mail]"
    
  
);

const App = () => (
  <ApolloProvider client=client>
    <Main />
  </ApolloProvider>
);

这是我的 GET_CURRENT_USER 查询：

import  gql  from "apollo-boost";

export const GET_CURRENT_USER = gql`
  query getUserData($id: ID!) 
    userData @client 
      id
      name
      email
    
  
`;

在这里我将我的组件包装到 graphql HOC 中：

...
export default graphql(GET_CURRENT_USER)(ProfileScreen);

我正在将 props.data 属性检查到 ProfileScreen 组件的渲染方法中，它被触发了 2 次：

错误：未定义； 加载：真； 没有 userData 字段

错误：未定义； 加载：假； 没有 userData 字段

我还检查了 Apollo 缓存并存储了 userData 字段

环境：

"apollo-boost": "^0.4.3", "react-apollo": "^2.5.8", "react-native": "0.60.4", "apollo-cache-inmemory": "^1.6.2", “反应”：“16.8.6”

【参考方案1】：

通过将 __typename 字段添加到 userData 对象来修复