调用cache.writeData时，apollo-link-state报错

Question

我刚接触apollo-link-state，并且被困了一段时间。我要解决的问题很简单，只需将模态信息保存到本地状态，但是，当我尝试保存到时，它会抱怨：

ApolloError.js?f55daa5:36 Uncaught (in promise) Error: Network error: Cannot read property 'selections' of null
    at new ApolloError (ApolloError.js?f55daa5:36)
    at Object.error (QueryManager.js?8f5ff47:115)
    at SubscriptionObserver.error (zen-observable.js?8f5ff47:176)
    at <anonymous>

我的源码，如下所示：

{ // resolvers and defaults
  resolvers: {
    Mutation: {
      openModal: (_, args, { cache }) => {
        const {name} = args
        cache.writeData({
          modal: {
            name,
            open: true,
            __typename: 'Modal',
          },
        })
        return null
      },
      closeModal: (_, __, {cache}) => {
        cache.writeData({modal: {open: false}})
      }
    }
  },
  defaults: {
    modal: {
      __typename: 'Modal',
      open: false,
      name: ''
    }
  }
}

graphql(
    gql`
        mutation openModal  ($name: String!) {
            openModal  (name: $name) @client
        }
    `
  )(
  ({mutate}) => {
    return (
      <div>
        <button onClick={() => mutate({ variables: { name: 'test' }})} >Open</button>
      </div>
    )
  }
)

单击该按钮时，会出现错误消息。有什么想法吗？

顺便说一下，我正在next.js中使用。

Answer 1

我也有同样的问题。在参考了the todos example中的代码之后，我发现必须像这样包装对象的{ data: { // your actual data } }。因此，在您的情况下，可能是：

cache.writeData({
  data: {
    modal: {
      name,
      open: true,
      __typename: 'Modal',
    },
  },
});