未处理的拒绝（错误）：无法分配给对象“#<Object>”的只读属性 'getPosts'

Question

我在互联网上搜索了有关此问题的解决方案，但还没有找到。我正在创建一个新的 post 并将其添加到 Apollo 根查询缓存中。出于某种原因，即使 newData returns 具有新查询的新对象，它也不会分配给缓存。

    const [createPost, { error }] = useMutation(CREATE_POST_MUTATION, {
    variables: values,
    update(proxy, result) {
      const data = proxy.readQuery({
        query: FETCH_POSTS_QUERY,
      });

      let newData = [...data.getPosts];
      newData = [result.data.createPost, ...newData];
      proxy.writeQuery({ query: FETCH_POSTS_QUERY, data: newData });
      values.body = '';
    },
  });

Answer 1

在发布了这个问题之后，我明白了。查看 apollo writeQuery 文档，我注意到您必须为每个状态制作一份副本。

const [createPost, { error }] = useMutation(CREATE_POST_MUTATION, {
    variables: values,
    update(proxy, result) {
      const data = proxy.readQuery({
        query: FETCH_POSTS_QUERY,
      });

      let newData = [...data.getPosts];
      newData = [result.data.createPost, ...newData];
      proxy.writeQuery({
        query: FETCH_POSTS_QUERY,
        data: {
          ...data,
          getPosts: {
            newData,
          },
        },
      });
      values.body = '';
    },
  });

Answer 2

你可以这样做：

  const [createPost, { error }] = useMutation(CREATE_POST, {
    variables: formValues,
    update(proxy, result) {
      const data = proxy.readQuery({
        query: FETCH_POSTS_QUERY,
      });
      proxy.writeQuery({
        query: FETCH_POSTS_QUERY,
        data: {
          getPosts: [result.data.createPost, ...data.getPosts],
        },
      });
      formValues.body = "";
    },
  });

未处理的拒绝（错误）：无法分配给对象“#<Object>”的只读属性 'getPosts'

Unhandled Rejection (Error): Cannot assign to read only property 'getPosts' of object '#<Object>'

apollo

reactjs

未处理的拒绝（错误）：无法分配给对象“#<Object>”的只读 属性 'getPosts'

Unhandled Rejection (Error): Cannot assign to read only property 'getPosts' of object '#<Object>'

apollo

reactjs

未处理的拒绝（错误）：无法分配给对象“#<Object>”的只读属性 'getPosts'