reactjs - 如何使用没有任何包的钩子向功能组件添加无限滚动？

Question

谁能建议我如何使用钩子向功能组件中的页面添加无限滚动，没有任何包。这是代码

{JSON&&JSON.map((assesment, index) => (
  <Row>
   <Col span={24}>
     <div>
       <div className="assesment-container">
         <Row>
          <h1 className="assesment-conatiner-title">
            <Row>
              <Title data-toggle="tooltip"
                     title="View Assesment"
                     level={5}
                     onClick={e => goToReadOnly(e, assesment.id)}
               >
                 Assesment-{assesment?.id}
               </Title>
               <Text id="version">&nbsp; [Version-{assesment?.version}]</Text>
             </Row>
           </h1>
         </Row>
         <Row>
           <Col span={18}>
             <div id="summary-desc"
                  dangerouslySetInnerHTML={{__html:assesment?.column_4==="<p></p>"||assesment?.column_4===""||assesment?.column_4?.length===0?"<div>&nbsp;</div>":assesment?.column_4&&assesment?.column_4.replace(/(<([^>]+)>)/ig, "").substring(0,80)}}
              />
              {/* 
                 <Text ellipsis={true} id="summary-desc" >
                     {assesment?.column_4&&assesment?.column_4.replace(/(<([^>]+)>)/ig, "").substring(0,40)}
                 </Text> */}
                          
             </Col>
          </Row>
       </div>
     </div>
   </Row>
  </Col>
   }))

这里 JSON 包含所有数据，我只想在向下滚动时呈现前 5 个列表，然后加载 5 个列表。任何人都可以建议没有任何软件包的功能。而且这里也没有 pageSize 的请求。

谢谢

标签： reactjsscroll