reactjs - React Native の Ref が機能しないのはなぜですか?

Question

React Native を使用してチャット メッセージ ページを作成しています。

次のコードがあります。

import React from 'react';
import {View,ScrollView,Text} from 'react-native';
import {Button} from 'native-base';

export default class MatchContact extends React.Component {
  constructor(props){
  super(props);
  this.scrollRef = React.createRef();
}

state = {
  messages: ['message1','message2','message3','message4']
}

handleScroll(){
  this.scrollRef.scrollToEnd()
}

render(){
  return(
    <View>
      <Button onPress={()=>this.handleScroll()}>
        <Text> Scroll To Bottom </Text>
      </Button>
      <ScrollView ref={this.scrollRef}>
         {this.state.messages.map(message => (
             <Text> {message} <Text/>
          ))}
      </ScrollView>
     </View>
  )
}

したがって、「下にスクロール」ボタンを押すと、ScrollView がページの最後までスクロールすると予想されますが、エラーが発生しました。

TypeError: _this5.scrollRef.scrollToEnd は関数ではありません。(「_this5.scrollRef.scrollToEnd()」では、「_this5.scrollRef.scrollToEnd」は未定義です)