React Infinite Scroll Jumps to the top on Next Page

Question

I have this component in React Infinite Scroll Component

  {!loading && data && (
    <InfiniteScroll
      dataLength={data?.length} //This is important field to render the next data
      next={fetchMoreData}
      hasMore={hasMore}
      loader={<h4>Loading...</h4>}
      // below props only if you need pull down functionality
      refreshFunction={refresh}
      
    >
      <div className="float-start">
        <ReactTabulator columns={tableColumns} data={data} tooltips={true} />
      </div>
    </InfiniteScroll>}

But whenever fetchMoreData() calls, the scrollbar is moving to the top. How can I handle this?