Управление вложенным состоянием в Apollo - PullRequest
Новая
       36

Управление вложенным состоянием в Apollo

0 голосов
/ 08 октября 2018

Я играю с apollo, в частности с apollo-link-state, чтобы заменить использование избыточности, и обрабатывать локальное и удаленное состояние в одном месте.

Я столкнулся с проблемой, где я могу 'Не могу найти никакой информации о том, как обращаться с вложенным состоянием.

Допустим, я хочу разделить состояние по назначению.В этом случае это будет сцена: 

{
  Home: {
   todos: [],
    __typename: 'Home'
  }
}

Затем в резольверах я хочу иметь мутацию, которая добавит новую задачу, поэтому состояние будет выглядеть следующим образом 

{
  Home: {
   todos: [{
     id: 'unique_id',
     value: 'Some value',
     __typename: 'Todo',
   }],
    __typename: 'Home'
  }
}

Я почти смог добиться этого с помощью следующего кода: 

const linkState = withClientState({
  cache,
  defaults: {
    Home: {
      todoBool: false,
      todos: [],
      __typename: 'Home',
    },
  },
  resolvers: {
    Mutation: {
      addTodo: (obj, { id, value }, { cache }) => {
        const result = cache.readQuery({
          query: READ_FROM_HOME,
        });
        const todos = [{ id, value, __typename: 'Todo' }, ...result.Home.todos];
        const data = {
          Home: {
            todos,
            __typename: 'Home',
          },
        };
        cache.writeQuery({
          query: READ_FROM_HOME,
          data,
        });
        return null;
      },
    },
  },
});

Где READ_FROM_HOME: 

const READ_FROM_HOME = gql`
  query {
    Home @client {
      todos
    }
  }
`;

Где кэш: 

const cache = new InMemoryCache({ 
 if (data) return data.id ? `${data.__typename}:${data.id}` : data.__typename;
});

К сожалению, в конце концовсостояние выглядит следующим образом: 

{
  Home: {
   todos: {
     type: 'json',
     json: Array(1)
   },
    __typename: 'Home'
  }
}

Из-за этого запрос ниже не будет работать: 

const READ_TODO = gql`
  query getTodos {
    Home @client {
      todos {
        id
      }
    }
  }
`;

Можно ли обработать такой случай с помощью InMemoryCache?Или я должен использовать другое решение для этого?

Заранее спасибо!

...