Skip to content

Instantly share code, notes, and snippets.

@jqn
Created August 4, 2021 07:56
Show Gist options
  • Save jqn/3803c6d3bc88b55feded001fa2ee5c63 to your computer and use it in GitHub Desktop.
Save jqn/3803c6d3bc88b55feded001fa2ee5c63 to your computer and use it in GitHub Desktop.
React Native: Handle hardware back button to navigate history in webview
import React, { Component } from 'react';
import { WebView, BackHandler } from 'react-native';
export default class WebViewMoviezSpace extends Component {
constructor(props) {
super(props);
this.WEBVIEW_REF = React.createRef();
}
componentDidMount() {
BackHandler.addEventListener('hardwareBackPress', this.handleBackButton);
}
componentWillUnmount() {
BackHandler.removeEventListener('hardwareBackPress', this.handleBackButton);
}
handleBackButton = ()=>{
this.WEBVIEW_REF.current.goBack();
return true;
}
onNavigationStateChange(navState) {
this.setState({
canGoBack: navState.canGoBack
});
}
render(){
return (
<WebView
source={{ uri: "https://moviez.space" }}
ref={this.WEBVIEW_REF}
onNavigationStateChange={this.onNavigationStateChange.bind(this)}
/>
)
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment