flatlist-react icon indicating copy to clipboard operation
flatlist-react copied to clipboard

load more items function gets called before user scrolls to bottom when scrollbar is not a parent of flatlist

Open nikhilgoswami opened this issue 1 year ago • 1 comments

Is your feature request related to a problem? Please describe. load more items function gets called before user scrolls to bottom when scrollbar is not a parent of flatlist

Describe the solution you'd like Option to pass id of scrollbar container if it is not the direct parent of flatlist

Additional context Sometimes it is not possible to add scrollbar as a parent to flatlist in these cases we need a option to pass id or class of scrollbar container so that flatlist knows it is not a direct parent of container

nikhilgoswami avatar Jul 01 '23 08:07 nikhilgoswami

try the new scrollingContainerId prop it by running npm i flatlist-react@next. It is not yet released

PR for more details -> https://github.com/beforesemicolon/flatlist-react/pull/104

Example:

// as a DEEP child of a scrolling ancestor element using the "scrollingContainerId" prop
<div style={{overflow: "auto", height: "300px"}} id="scrolling-container">
  <div className="mid-wrapper">
    <div className="list-wrapper">
      <FlatList
        list={this.props.people}
        renderItem={this.renderPerson}
        renderWhenEmpty={this.showBlank}
        scrollingContainerId="scrolling-container"
      />
    </div>
  </div>
</div>

ECorreia45 avatar Jul 01 '23 23:07 ECorreia45