Webview freezed after using the stopLoading of react-native-webview

Question

I want to open a webpage in React native Webview and the hrefs (links) to be opened in the default browser. I tried using the stopLoading method of Webview but it freezes the view. I successfully achieved this using the answer on this thread.

The method stopLoading of react-native-webview causes the website to freeze

But in some cases, randomly, Upon click of href link, it opens the webpage in the Webview as well beside opening it in the default browser. I want it to be opened in the brwoser only. Please check what's I am doing wrong here. Or is there any better approach to achieve this?

Here is the code I am using:

LoadingIndicatorView() {
    return (
      <ActivityIndicator
        color="#009b88"
        size="large"
        style={{ flex: 1, justifyContent :'center', }}
      />
    );
  }

  handleWebViewRequest = request => {
    const {url} = request;
    Linking.openURL(url);
    return false;
  }

  render() {

    let uri = 'https://www.google.com/';
    let sku = this.props.route.params.sku;
    let location = this.props.route.params.location;

    return (
      <WebView
      ref={ref => (this.webview = ref)}  
      source={{ uri: uri, method: 'POST', body: 'device=tablet&search='+sku+'&ref='+location }}
      renderLoading={this.LoadingIndicatorView}
      startInLoadingState={true}
      onShouldStartLoadWithRequest={this.handleWebViewRequest.bind(this)}
      style={{ flex: 1 }}
      />    
    );
  }

Tragedienne

I find the random behaviour very strange. But I had a look in my code and saw that I added 'this.webview.goBack()' after opening the URL externally and afterwards I return true instead of false. This is most certainly a little to hacky for being a good solution. Unfortunately I haven't been working on that project for a while now, so I fear, I am of no further use here '^^. – Lammond

Answer 1

I added stopLoading in the method that gets invoked for onShouldStartLoadWithRequest

webViewRef.current.stopLoading();

where webViewRef is the ref of the webView

ref = { webViewRef }

Overhang

Can you please correct me if I am doing wrong: I am trying this: ref={ref => (this.webview = ref)} onShouldStartLoadWithRequest={ref.current.stopLoading();} – Tragedienne