如何在pageInfo中将总计数传递给客户端

IT技术 javascript reactjs relayjs graphql-js
2021-05-17 17:13:37

我使用first afterlast before做分页。 hasNextPage并且hasPreviousPage非常有用。

但我还需要的是total count这样我可以计算和显示像page 5 of 343 pages在客户端上的东西

不幸的是,pageInfo即使我在服务器站点上有信息,这也不是其中的一部分

您能否已经做的那样totalpageInfo和 中包含一个字段并扩展connectionFromArray到总数中?arrayLengthconnectionFromArraySlice

谢谢

3个回答

pageInfo旨在表示有关特定页面的信息,而项目总数实际上是连接本身的属性。我们建议count在连接中添加一个字段。您可以使用以下命令查询它:

fragment on TodoList {
  tasks(first: 10) {
    count # <-- total number of tasks
    edges { ... }
    pageInfo { ... }
}

继电器支持任意域的连接,所以你可以自由命名此counttotalCount等等。

谢谢@Joe Savona

他是完全正确的。由于我花了一些时间来弄清楚如何将属性实际添加到服务器站点上的连接中,我想我也在这里分享一下:

var {connectionType: postsConnection} = connectionDefinitions({
  name: 'post',
  nodeType: qlPost,
  connectionFields: () => ({
    totalCount: {
      type: GraphQLInt,
      resolve: (connection) => connection.totalCount,
      description: `A count of the total number of objects in this connection, ignoring pagination.
This allows a client to fetch the first five objects by passing "5" as the
argument to "first", then fetch the total count so it could display "5 of 83",
for example.`
    }
  })
});

希望能帮助别人。

干杯

totalCount在连接上使用了一段时间的自定义字段,但它引入了我起初没有看到的复杂性(在突变后更新连接时,如果您希望它自动更新,则必须使用相同的参数查询它)。

因此,我回到在count我的每个连接旁边都有一个字段。在您的示例中,这意味着:

fragment on TodoList {
  taskCount
  tasks {
    edges { ... }
  }
}

我创建了一个为我创建它的小助手:https : //github.com/rea-app/relay-connection-count