javascript - 如何在反应原生 webview 中显示弹出选项卡？

Question

我有一个网页，如果用户订阅，则加载一本书，否则如果订阅过期，它将加载此页面：

我在渲染之前将页面加载到变量中以使用户体验顺利进行，然后将变量附加到 webview 的 HTML 中。负载工作正常，但是当我单击以下按钮时没有任何反应，我希望进行与网络上相同的交互。我怎样才能使用 react native webview 来实现这一点。

这是 webview 代码：

<WebView 
 key={this.state.value}
 ref={webview => this.setState({WebViewRef:webview})}
 javaScriptEnabled={true}
 domStorageEnabled={true}
 scalesPageToFit={false}
 onLoadEnd={
   this.setState({
   visibleBack:false
  })
 }
 automaticallyAdjustContentInsets={false}
 source={{ html:htmlString,}} style={{height : this.state.webViewHeight, width: this.state.notSubbedHeight== 1 ? Dimensions.get('window').width-20 :Dimensions.get('window').width-40, justifyContent:'center' ,alignItems:'center',marginTop:20}}
 key={this.state.key}
 injectedJavaScript={jsBeforeLoad}
 onMessage= {this.onMessage}
 scrollEnabled={false}
/>

这就是我如何获得 htmlString

 getProductsummary = async (product) => {

    this.setState({ loading: true });
    const username = await AsyncStorage.getItem('username');
    if(username !== undefined){
      fetch(Config.backendAPI+`/cleanbook_mobile.php?idbook=${product.id}&username=${username}`)
      .then((response) =>{
          return response.text();
        }
      ).then((result)=>{
        let resp = result;
          if (resp == null || resp == "") {
            resp = "<div style=\"font-family :Georgia\" >" + Languages.SummaryVide + "</div>";
          }
          if(resp.includes("paypal-button-container-P")){
            this.setState({notSubbedHeight:1})
          }
          this.setState({ summary: resp, loading: false });
      }).catch((error) => console.log(error));
    }else{
      this.setState({
        notSubbed: 1,
      })
    }
  };

var htmlString = `<div id="summaryDiv"> ${this.state.summary} </div>`;

标签： javascriptreact-native