标签: react-apollo

我有以下 GraphQL 订阅，运行良好：

subscription voucherSent($estId: Int!) {
  voucherSent(estId: $estId) {
    id
    name
    usedAt
    sentAt
  }
}

但以下发送“无法读取未定义的属性‘用户’”错误

subscription voucherSent($estId: Int!) {
  voucherSent(estId: $estId) {
    id
    name
    usedAt
    sentAt
    owner {
      id
      username
    }
  }
}

Apollo GraphQL 订阅是否处理嵌套查询？

这是我的解析器代码：

return models.Voucher.update({
    sentAt: moment().format(),
    usedIn: args.sentTo,
  }, { where: { id: args.id } })
    .then(resp => (
      models.Voucher.findOne({ where: { id: args.id } })
        .then((voucher) => {
          pubsub.publish(VOUCHER_SENT, { voucherSent: voucher, estId: voucher.usedIn });
          return resp;
        })
    ))

我有一个突变：

const createSomethingMutation = gql`
  mutation($data: SomethingCreateInput!) {
    createSomething(data: $data) {
      something {
        id
        name
      }
    }
  }
`;

如何Something在一个请求中创建多个？我需要像这样在我的GraphQL服务器上创建一个新的Mutation吗：

mutation {
  addManySomethings(data: [SomethingCreateInput]): [Something]
} 

还是有一种方法可以createSomethingMutation在一个请求中多次使用来自Apollo Client的现有方法和不同的参数？

我正在使用 apollo-boost 构建一个应用程序，其中应该已经包含一些使用 graphql 执行 React 应用程序的包。

我想将数据片段存储到 Apollo 缓存时遇到错误。

ApolloClient.tsx

import ApolloClient from 'apollo-boost'
import { InMemoryCache } from 'apollo-cache-inmemory'

import { secretToken } from './secretToken'

const cache = new InMemoryCache({
})

const client = new ApolloClient({
  uri: 'https://someUrlIremovedForTheQuestion.com',
  request: async operation => {
    operation.setContext({
      headers: {
        Authorization: secretToken
      }
    })
  },
  cache
})

client.writeData({
  data: {
    names: [
      {
        firstName: 'Mario'
      },
      {
        firstName: 'Luigi'
      }
    ]
  }
})
export default client

现在我试图访问我在同一个 apollo 配置中创建的这些名称：

我的组件.tsx

const result …

我在测试中仅获取加载状态和未定义的数据。我不知道为什么我要遵循给定示例中的所有内容。请帮忙。

测试文件。当我等待这条线执行时await wait(() => getByTestId('edit-category'));。它将查询的响应数据提供为未定义。错误：TypeError: Cannot read property 'getCategory' of undefined 第 34 行editConatinerCategory.tsx=>category={data!.getCategory!}

import React from 'react';
import gql from 'graphql-tag';
import { cleanup, wait } from 'react-testing-library';
import { customRender } from '../../../test-utils/customRender';
import { EditCategoryContainer } from './Container';

afterEach(() => {
  cleanup();
  console.error;
});
console.error = jest.fn();

const getCategoryMock = {
  request: {
    query: gql`
      query getCategory($id: Int!) {
        getCategory(id: $id) {
          id
          name
          active
          position
        }
      }
    `,
    variables: { …

我正在学习 graphQL。有人可以帮助我理解为什么架构中没有识别突变吗？

出现此错误：

 Error: "Mutations" defined in resolvers, but not in schema

以下是代码：

架构：

const typeDefs = gql`
 type Author {
 age: String
 name: String
 books: [String]
}

type Query {
  authors: [Author]
  author(id: String): Author
}

type Mutation {
  addAuthor(name: String, age: Int, books: [String]): Author    
}  
`;

const schema = makeExecutableSchema({ typeDefs, resolvers });
export default schema;

解析器：

const resolvers = {
Query: {
    authors: () => {
        // return authors;
    },
    author: (root, { id }) => …

我正在使用 apollo 客户端 v2.6 并使用 @apollo/react-hooks 与我的 graphql 查询和突变进行交互。我遇到的问题是在一个组件中进行多个 apollo 操作。我可以执行查询和突变，但检索问题所在的数据，因为从下面的代码来看

[getEvents, { data }] = useQuery(GET_EVENTS),
    [createEvent, { data }] = useMutation(CREATE_EVENT)

您注意到，为了从操作中获取数据，我必须使用 data 属性，但我得到的错误是

解析错误：标识符“data”已被声明

那么有没有另一种方法可以从操作中获取数据而无需使用数据两次 提前致谢

我的项目目录结构是这样的：

- schema.graphql
- package.json
- packages
-- types
--- package.json
--- src
---- graphql-types
----- user.ts
----- generated

现在在这里，schema.graphql包含从apollo client:download-schema. user.ts包含我这样的 graphql 查询：

- schema.graphql
- package.json
- packages
-- types
--- package.json
--- src
---- graphql-types
----- user.ts
----- generated

现在的问题是，我需要为此查询生成类型定义，如果我在代码生成命令中添加文件的确切路径，则 apollo codegen 命令只会选择文件，如下所示：

我想告诉生成器搜索那里的所有 ts 文件。我尝试了以下但都失败了：

export const CURRENT_USER = gql`
  query CurrentUser {
    currentUser {
      id
      name
    }
  }
`;

我总是得到两个错误之一：

No operations or fragments found to generate code for.

或者 …

我有一个突变（UploadTransaction）返回某个名为 Transaction 的对象的特定列表。

#import "TransactionFields.gql" 
mutation UploadTransaction($files: [Upload!]!) {
  uploadFile(files: $files){
    transactions {
      ...TransactionFields
    }
  }
}

从后端（石墨烯）返回的交易具有 id 和 typename 字段。因此它应该自动更新缓存中的事务。在 Apollo 的 chrome 开发工具中，我可以看到新的交易：

我还有一个查询 GetTransactions 获取所有 Transaction 对象。

#import "TransactionFields.gql"
query GetTransactions {
  transactions {
    ...TransactionFields
  }
}

但是我没有看到查询返回新添加的事务。在初始加载期间，Apollo 客户端加载了 292 个事务，显示在 ROOT_QUERY 下。它不断返回相同的 292 笔交易。UploadTransaction 突变在开发工具的缓存中添加“事务”类型的新对象，而不会影响开发工具中的 ROOT_QUERY 或我在代码中的查询。

TransactionFields.gql 是

fragment TransactionFields on Transaction {
    id
    timestamp
    description
    amount
    category {
      id
      name
    }
    currency
}

知道我做错了什么吗？我是阿波罗客户端和 graphql 的新手

我试图在提交表单/onClick 后调用 useLazyQuery，但由于某种原因我总是未定义。这是我定义钩子的方式；

const component = () => {
 const [getMyValues, {loading, error, data: myValues}] = useLazyQuery(GET_MY_VALUES);
 
 onSubmit = async () => {
   if(checkCondition){
     const someData = await getMyValues({ variables: {o: names } });
     console.log({someData})    //undefined
   }
 }
}

如何获取someData变量中的查询数据？

正如我们所知，当 props 或 state 发生变化时，react 组件会重新渲染。

我现在正在使用useQuery从react-apollo包象下面这样：

import { gql, useQuery } from '@apollo/client';

const getBookQuery = gql`
  {
    books {
      name
    }
  }
`;

function BookList() {
    const { loading, error, data} = useQuery(getBookQuery);

    if(loading) return <p>Loading....</p>
    if(error) return <p>Ops! Something went wrong</p>

    return (
      <>
        <ul>
          {data.books.map(book => (
            <li key={book.name}>{book.name}</li>
          ))}
        </ul>
      </>
    )
}

export default BookList;

当我运行上面的代码时，我们首先进入Loading...DOM，然后将其更新为包含查询数据的列表（一旦它到达）。但是一旦从查询中收到数据，react 如何知道重新渲染我的组件。

这些data,loading和error属性是否映射到组件 props 并且它们正在更新？如果是这样，为什么 chrome 开发工具不显示此 …