this._scrollViewRef.scrollTo is not a function

The recyclerlistview performance is very good. But i am having a issue with the onEndReached props. After calling the onEndReached i am adding the new data to the DataProvider. But after the data is added i m getting error this._scrollViewRef.scrollTo is not a function

class NewsList extends React.Component {

constructor(props) {
    super(props);
this.dataProvider = new DataProvider((r1, r2) => {
                return r1 !== r2;
            }).cloneWithRows(this.props.list);
}

componentWillReceiveProps  ()  {   
   this.setState(prevState => ({
    dataProvider: prevState.dataProvider.cloneWithRows(this.props.list)
  }))   
  }

render() {     
 return (
  <View style={{flex:1}}>
<RecyclerListView
         ref={ref => {this.listRef = ref;}}
          contentContainerStyle={{paddingBottom:80}}
         externalScrollView={ExtendedScrollView}
         layoutProvider={this._layoutProvider}
         dataProvider={this.state.dataProvider}
         rowRenderer={this._rowRenderer} 
         onEndReached={() => this.props.handleLoadMore()}
         onEndReachedThreshold={0.3}
         renderFooter={this.renderFooter}
         animatedEvent={{nativeEvent: {contentOffset: {y: this.scroll}}}}
         renderAheadOffset={250}        
         refreshControl={
              <RefreshControl
              refreshing={this.state.refreshing}
              onRefresh={this._onRefresh.bind(this)} />
                  }
         /> 
    </View>    
    );
  }
}

[msmfsd]

This worked for me:

const listView = useRef();

const scrollToTop = () => {
  listView.current?.scrollToOffset(0, 0, true);
};

<RecyclerListView ref={listView}...

[SvenJonsson]

Thanks for your reply! @evert-smit, what I had imagined would be that the ref would be somehow magically passed on to the component but of course it would not be.

Reading your comment I did this 5min solution as I really need the ref to control it from some other UI components.

render() {
    return <RecyclerListView 
    setScrollViewRef={(ref) => this.scrollViewRef = ref}
    externalScrollView={ExternalScrollView}
    layoutProvider={this._layoutProvider}
    dataProvider={this.state.dataProvider}
    rowRenderer={this._rowRenderer} />;
 };

and setScrollViewRef will be passed on to the ExternalScrollView and you can do something like

componentDidMount(){
    this.props.setScrollViewRef(this._scrollViewRef)
  }