反应放大查询与连接答案

【问题标题】：React Amplify query with connection反应放大查询与连接
【发布时间】：2020-07-17 15:44:46
【问题描述】：

我目前正在使用 Amplify Cli 构建一个 React 应用程序。

schema.graphql

type Ticket @auth(rules: [{ allow: owner, operations: [create, update, delete] }]) @model @searchable  {
  id: ID!
  location: String
  city: String
  comment: String
  owner: String
  startDate: String
  endDate: String
  status: String
  request: [Request] @connection(keyName: "byRequest", fields: ["id"])
}

type Request @auth(rules: [{ allow: owner, operations: [create, update, delete] }]) @model @searchable @key(name: "byRequest", fields: ["ticketID"]) {
  id: ID!
  ticketID: ID!
  requester: String
}

为相关 searchTickets 查询从放大生成的代码

export const searchTickets = /* GraphQL */ `
  query SearchTickets(
    $filter: SearchableTicketFilterInput
    $sort: SearchableTicketSortInput
    $limit: Int
    $nextToken: String
  ) {
    searchTickets(
      filter: $filter
      sort: $sort
      limit: $limit
      nextToken: $nextToken
    ) {
      items {
        id
        location
        city
        comment
        owner
        startDate
        endDate
        status
        request {
          nextToken 
        }
      }
      nextToken
      total
    }
  }
`;

当我尝试在 Appsync 中查询数据时，结果如预期的那样包含请求者的数组。

query {
  searchTickets {
     items{
      location
      owner
      request {
        items{
          requester
        } 
      }
    }
  }
}

现在我正在为 React 代码苦苦挣扎，因为请求者的数组不包括在内。其余代码工作正常，我从 Ticket（位置、城市...）获取所有数据，但没有从“请求”类型获取数据。

反应查询代码：

 await API.graphql(
        graphqlOperation(queries.searchTickets, {
          limit, // limit is set in a const
          sort: {
            field: 'startDate',
            direction: 'asc'
          },
          filter: {
            location: {
              eq: location
            },
            city: {
              eq: city
            }
          }
        })
      )
        .then(payload => {
          const data = payload.data.searchTickets.items;
          setTickets(tickets => tickets.concat(data)); 
        })
        .catch(err => {
          console.log('error: ', err);
        });

知道为什么“Request”数组为空，或者我如何通过 searchTickets 查询访问“Request”类型的数据？

谢谢！

PS：如果需要，我很乐意提供更多代码/信息。

【问题讨论】：

标签： reactjs graphql aws-amplify aws-appsync

【解决方案1】：

可以通过 cli 使用amplify configure codegen 配置查询深度。现在覆盖在official documentation

【讨论】：

【解决方案2】：

你有 .graphqlconfig.yml 文件吗？请检查 Amplify 的深度。

projects:
  <YOUR_PROJECT_NAME>:
    extensions:
      amplify:
        maxDepth: <CHANGE_THIS>

【讨论】：

projects: share: schemaPath: src/graphql/schema.json 包括：- src/graphql/**/*.js 不包括：- ./amplify/** 扩展：放大：codeGenTarget: javascript generatedFileName: '' docsFilePath: src/graphql extensions: amplify: version: 3 => 没有定义深度
然后添加属性并将其设置为深度级别以测试是否可以为您解决问题。 “maxDepth:10”应该足够了。