Geek Answers Handbook

React Native webview get url

A Webview component that allows you to specify a destination URL, for example. facebook.com

render() { return ( <WebView source={{uri: https://www.facebook.com}} style={{marginTop: 20}} /> ); }

However, if I click the link in facebook, how can I get the URL or the URL has landed?

+8
react-native webview
source share
1 answer

Here is the web view I used for my previous project.

 <WebView ref="webview" source={{uri:this.state.url}} onNavigationStateChange={this._onNavigationStateChange.bind(this)} javaScriptEnabled = {true} domStorageEnabled = {true} injectedJavaScript = {this.state.cookie} startInLoadingState={false} />

this line is important to you:

  onNavigationStateChange={this._onNavigationStateChange.bind(this)}

and you can read the url like this:

 _onNavigationStateChange(webViewState){ console.log(webViewState.url) }

If I remember correctly, this works 3 times when loading the URL.

webviewState object prototype:

 { canGoBack: bool, canGoForward: bool, loading: bool, target: number, title: string, url: string, }

3rd (final) time when this event is called, the load attribute is false

let me know if that helps.

+21
source share

More articles:


All Articles