滚动时加载graphql内容

Question

当用户滚动时如何加载graphql内容？因为我喜欢10.000条记录，所以我不想全部渲染它们。我想只显示80并在滚动时渲染更多。 这是代码：

<Query query={ALL_BOT_ITEMS_QUERY}>
 {({loading, error, data}) => {
    if(loading) return <div className="preloader show"></div>
    if(error) return <p>Error: {error}</p>

    return (
      <Scrollbars style={{height: '570px'}}>
        {data.allBotItems.map(item => {
          if(this.props.bot.choosenItemsIds.indexOf(item.id) === -1) {
            return <Item key={item.id} item={item} conditions={this.state.conditions} side='bot' />
          }
        })}
      </Scrollbars>
    )
  }}
</Query>