如何在Apollo Client 3中初始化变量

问题描述

嘿,我正在尝试学习Apollo Client v3,但是我无法全神贯注于文档和新的本地状态管理。

我想要一个可以记住上次使用的月份和年份的状态。 这是我创建新的ApolloClient时在旧Apollo中所拥有的内容

clientState: {
  defaults: {
    currentMonth: 8,currentYear: 2020,},

所以试图了解新文档,这就是我尝试过的

const cache = new InMemoryCache({
    typePolicies: {
        clientState: {
            fields: {
                month: 8,year: 2020,});

但是没有运气。我不理解文档真的很傻,但是很难找到与我的问题类似的东西。 现在,我真的很接近交换Redux,但仍希望找到解决方案。

解决方法

您可以在Apollo Client 3中使用反应变量。

https://www.apollographql.com/docs/react/local-state/reactive-variables/#:~:text=New%20in%20Apollo%20Client%203,application%20without%20using%20GraphQL%20syntax

以您的示例为例:

定义

import { makeVar } from '@apollo/client';

export const currentMonth = makeVar(8);
export const currentYear = makeVar(2020);

获取

import { currentMonth,currentYear } from "./yourPath/yourFile";

// Output: 8
console.log(currentMonth());

// Output: 2020
console.log(currentYear());

设置

import { currentMonth,currentYear } from "./yourPath/yourFile";

currentMonth(9);
    
// Output: 9
console.log(currentMonth());
    
currentYear(2021);
    
// Output: 2021
console.log(currentYear());