Невозможно прочитать свойство '# <WebView>' неопределенного реагирующего натива - PullRequest
Новая
       21

Невозможно прочитать свойство '# <WebView>' неопределенного реагирующего натива

0 голосов
/ 20 октября 2019

Я создаю Webview в реагирующем родном языке, но когда я перехожу на любую страницу и пытаюсь перейти назад, приложение закрывается.

Я прочитал некоторые ответы в STACK-OVERFLOW и попробовал некоторый код для обработкикнопка назад андроида, но это не помогло.

Вот код, который пытался: 

import {
  SafeAreaView,
  StyleSheet,
  ScrollView,
  View,
  Text,
  StatusBar,
  BackHandler,
} from 'react-native';

import WebView from 'react-native-webview';

const App: () => React$Node = () => {

  const [canBack, setCanBack] = useState(false);
  useEffect(() => {
    this.backHandler = BackHandler.addEventListener('hardwareBackPress', this.handleBackPress);
    console.log('mounted')

    return () => {
      this.backHandler.remove()
      console.log('unmounted')
    }

  }, [canBack]);

  handleBackPress = () => {
    console.log('back btn pressed')
    console.log('canBack is '+canBack)
    if(canBack) {
      this.refs[myWebView].goBack();
      return true;
    }
  }


  onNavigationChange = (navState) => {
    console.log(navState);
    // console.log(navState.canGoBack)
    setCanBack(currentCanBack => navState.canGoBack);
    console.log(canBack);
  };

  return (
      <SafeAreaView style={{ flex: 1,}}>
        <StatusBar barStyle="dark-content" />
        <WebView
          ref={(c) => {this.myWebView = c} }
          source={{ uri: 'https://infinite.red' }}
          domStorageEnabled={true}
          onNavigationStateChange={(navState) => this.onNavigationChange(navState)}
        />
      </SafeAreaView>
  );
};

const styles = StyleSheet.create({
  scrollView: {
    flex: 1,
    backgroundColor: 'lightgrey',
    justifyContent: 'center',
    alignItems: 'center',
  },
});

export default App;

В этом, когда я нажимаю кнопку назад, это дает мне ошибку "Невозможно прочитать свойство '#' неопределенного собственного ответа"

Ответы [ 2 ]

0 голосов
/ 21 октября 2019

Здесь я получил решение этой проблемы.

Я просто использовал this.myWebView.goBack (); , и это сработало. Так, может быть в реакции 0.61, когда мы используем хуки и мы находимся в компоненте функции, мы должны использовать его таким образом.

0 голосов
/ 20 октября 2019

Per: ref = {(c) => {this.myWebView = c}}

следующее: this.refs [myWebView] .goBack ();

должно быть:this.myWebView.goBack ();

...