突变组件中 cache.writeQuery 上缺少字段？答案

【问题标题】：Missing field on cache.writeQuery in Mutation Component?突变组件中 cache.writeQuery 上缺少字段？
【发布时间】：2018-09-22 03:47:28
【问题描述】：

我正在研究 GraphQL Mutation 组件。我正在做一个增加决议的突变，即新年决议。这是架构：

type Resolution {
  _id: String!
  name: String!
  goals: [Goal]
  completed: Boolean
}

type Query {
  resolutions: [Resolution]
}

type Mutation {
  createResolution(name: String!): {
        Resolution
        user: String
    }
}

以下是解析器：

import Resolutions from "./resolutions";
import Goals from "../goals/goals";
import { PubSub } from 'graphql-subscriptions';

export const pubsub = new PubSub();

export default {
    Query: {
        resolutions(obj, args, { userId }) {
            return Resolutions.find({
                userId
            }).fetch();
        }
    },

    Resolution: {
        goals: resolution =>
            Goals.find({
                resolutionId: resolution._id
            }).fetch(),

        completed: resolution => {
            const goals = Goals.find({
                resolutionId: resolution._id
            }).fetch();
            if (goals.length === 0) return false;
            const completedGoals = goals.filter(goal => goal.completed);
            return goals.length === completedGoals.length;
        }
    },

    Mutation: {
        createResolution(obj, { name }, { userId }) {
            if (userId) {
                const resolutionId = Resolutions.insert({
                    name,
                    userId
                });
                return Resolutions.findOne(resolutionId);
            }
            throw new Error("Unauthortized");
        }
    },
};

这是用户解析器：

export default {
  Query: {
    user(obj, args, { user }) {
      return user || {};
    }
  },
  User: {
    email: user => user.emails[0].address
  }
};

这是突变组件：

const ResolutionForm = () => {
    let input;
    let state = {
        error: null
    };

    return (
        <Mutation
            mutation={CREATE_RESOLUTION}
            update={(cache, {data: {createResolution}}) => {
                const {resolutions} = cache.readQuery({query: GET_RESOLUTIONS});
                cache.writeQuery({
                    query: GET_RESOLUTIONS,
                    data: {resolutions: resolutions.concat([createResolution])}
                });
            }}
        >
            {(createResolution, {data}) => (
                <div>
                    <form
                        onSubmit={e => {
                            e.preventDefault();
                            createResolution({
                                variables: {
                                    name: input.value
                                },
                            });
                            input.value = "";
                        }}
                    >
                        <input
                            ref={node => {
                                input = node;
                            }}
                        />
                        <button type="submit">Submit</button>
                    </form>
                </div>
            )}
        </Mutation>
    );
};

这是在应用启动时加载所有分辨率的查询：

const GET_RESOLUTIONS = gql`
  query Resolutions {
    resolutions {
      _id
      name
      completed
      goals {
        _id
        name
        completed
      }
    }
    user {
      _id
    }
  }
`;

这很好，但是当我运行突变时：

const CREATE_RESOLUTION = gql`
    mutation createResolution($name: String!) {
      createResolution(name: $name) {
        __typename
        _id
        name
        goals {
          _id
          name
          completed
        }
        completed
      }
    }
`;

...我收到控制台日志错误消息：

Missing field user in {
  "resolutions": [
    {
      "_id": "GKTNgbuiDgiZ4wAFZ",
      "name": "testing 123",
      .....

如何将user 字段添加到我的突变响应中？

【问题讨论】：

其他DataScalarType可以覆盖吗？ type ResolutionCover { resolution: Resolution user: String }

标签： graphql apollo apollo-client apollo-server

【解决方案1】：

使用的 GET_RESOLUTIONS 查询最初来自父组件 App.js。它实际上包含两个单独的查询——一个用于解决方案，一个用于用户。 CREATE_RESOLUTION Mutation 查询和解析器不返回用户数据，我还不知道如何让他们这样做。

但是，Mutation 组件不需要用户数据。它只会在调用 cache.writeQuery 时感到不安，因为 GET_RESOLUTIONS 正在请求 user，而 Mutation 解析器没有返回 user。

所以修复似乎是有一个特殊的 GET_RESOLUTIONS_FOR_MUTATION_COMPONENT 查询，它首先不要求user：

const GET_RESOLUTIONS_FOR_MUTATION_COMPONENT = gql`
  query Resolutions {
    resolutions {
      _id
      name
      completed
      goals {
        _id
        name
        completed
      }
    }
  }
`;

[.....]
     const {resolutions} = cache.readQuery({query: GET_RESOLUTIONS_FOR_MUTATION_COMPONENT});
[.....]

使用没有错误消息要求user。

【讨论】：