apollo-link-state,如何访问本地状态/缓存?

时间:2019-02-06 05:42:27

标签: graphql apollo apollo-link-state

也许我只是不了解apollo-link-state的功能,但是我发现如果我有一个“默认”值,那将通过提供者显示在我的道具中。但是,我找不到它。您如何访问“缓存”或本地状态?

我有:

This helps the user to instantiate 
Removed
Basic
afdaf
Clip
Python
matching of many parts

我为解析器传递了一个空对象,因为复制后端中的所有缩减器绝对没有意义。我想我会在道具中看到“名字:Biff”。不。

商店是我的“ redux”商店,不属于此问题。我想到了那个“客户端”道具,就会看到默认值。不。

import { ApolloClient, createNetworkInterface } from 'react-apollo';
import { InMemoryCache } from 'apollo-cache-inmemory';
import { withClientState } from 'apollo-link-state';
import dataIdFromObject from './dataIdFromObject';

const defaults = {
  NAME: 'Biff'
};
const resolvers = {};

const cache = new InMemoryCache();
const stateLink = withClientState({ cache, resolvers, defaults });

const apolloClient = new ApolloClient({
  cache,
  link: stateLink,
  networkInterface: createNetworkInterface({
    uri: `${config.url}/graphql`,
    opts: {
      credentials: 'include'
    }
  }),
  addTypename: true,
  dataIdFromObject
});

当我将道具记录在子组件中时,任何地方都没有缓存迹象或“ name:Biff”。我如何在子组件中达到此本地状态。如果我用一个突变来更新它,我应该看到我的组件重新呈现并可以访问该新的更新后的本地状态...但是,它在哪里?

1 个答案:

答案 0 :(得分:1)

如文档中所述,除了查询@client指令以使Apollo知道您正在通过apollo-link-state发出请求外,您查询本地状态的方式与查询远程服务器一样。因此,我们需要一个GraphQL查询,并用graphql-tag模板文字标记包装:

const GET_NAME = gql`
  query {
    NAME @client
  }
`

我们就像使用其他查询一样使用它:

<Query query={GET_NAME}>
  {({ loading, error, data }) => {
    // render appropriate component depending on loading/error state
  }}
</Query>

尽管Apollo公开了reading and writing to the cache的方法,但这些方法仅应在为您的本地状态创建突变的上下文中使用。查询缓存应该通过Query组件完成,而实际更改缓存应该通过Mutation组件完成。您可以阅读有关在文档中编写自己的变异的更多信息。