React js createRef (), возвращающий undefined

Я очень новичок в reactjs. В настоящее время разрабатывается мобильное приложение с использованием нативного ReactJS с использованием expo.io. В моем проекте я использую webView для отображения содержимого. Работает нормально. Но у меня возникает проблема, когда я пытаюсь реализовать goBack ().

Пример, которому я следовал: https://blog.defining.tech/adding-a-back-button-for-react-native-webview-4a6fa9cd0b0

Поскольку this.refs обесценивается, я пытаюсь изменить его на createRef () Другой исх. за которым я следил: https://reactjs.org/docs/refs-and-the-dom.html#adding-a-ref-to-a-class-component

Когда выполняется goBack (), передается сообщение «undefined is not an object».

Могу я узнать решение для этого?

Вот мой код:

enter code here
import React from 'react';
import {
  StyleSheet,
  Text,
  View,
  TouchableOpacity,
  WebView
} from 'react-native';

export default class App extends React.Component {

  constructor(props) {
    super(props);
    this.webRef = React.createRef();     
    this.state = { canGoBack: false };
  }

  render() {
    return (
      <View style = {styles.container}>
        <WebView
          ref = {this.webRef}
          style = {{flex: 1}}
          onNavigationStateChange=
            {this.onNavigationStateChange.bind(this)}
          source = {{uri: 'http://www.google.com'}}
          /> 
          <View style = {styles.bottombar}>
          <TouchableOpacity
            disabled = {!this.state.canGoBack}
            onPress = {this.onBack.bind(this)}
            >
            <Text style = {this.state.canGoBack ? styles.topbarText : styles.topbarTextDisabled}>Go Back</Text>
          </TouchableOpacity>
        </View>
      </View>
    );
  }

  onBack() {
    // error: undefined is not an object 
    this.webRef.current.goBack();
  }


  onNavigationStateChange(navState) {
    this.setState({
      canGoBack: navState.canGoBack
    });
  }
}