seatgeek / react-infinite

A browser-ready efficient scrolling container based on UITableView
Other
2.71k stars 275 forks source link

Problem when using with React-Custom-Scrollbars #285

Open enesyteam opened 5 years ago

enesyteam commented 5 years ago

Hi,

I'm using your library with react-custom-scrollbars and having an issue. This is my code:

`<Scrollbars className="customscrollbars" height={ this.state.windowHeight - 54 } ref="conversationlistscroll" renderThumbVertical={props => <div {...props} className="c-scrollbarbar"/>} renderTrackVertical={props => <div {...props} className="c-scrollbar__track"/>} renderTrackHorizontal={props => <div {...props} className="track-horizontal" style={{display:"none"}}/>} renderThumbHorizontal={props => <div {...props} className="thumb-horizontal" style={{display:"none"}}/>} autoHide autoHideTimeout={ 1000 } autoHideDuration={ 200 } onScroll={ this.handleScroll }

<Infinite elementHeight={ 80 } useWindowAsScrollContainer infiniteLoadBeginEdgeOffset={ 100 } onInfiniteLoad={this.handleInfiniteLoad} isInfiniteLoading={this.state.isInfiniteLoading} ref="mylist"

{ conversations.length > 0 && conversations.map( this.renderConversation ) } `

And this is handleScroll method:

handleScroll = () => { let scollTop = this.refs.conversationlistscroll.getScrollTop(); this.refs.mylist.handleScroll( scollTop ); }

Infinite load is OK for the first time infinite load: 1111

But when the second infinite load has error:

222222

Can you tell me how to resolve this problem, thanks you very much!

tkuzenkova commented 5 years ago

How did you resolve this issue?

enesyteam commented 5 years ago

Finally I decided to build my own infinite list with custom scrollbar!