Question

我们在React Native项目中使用Webview来加载URL并显示一些网页。正在成功加载。但是，Android中出现了问题。

在iOS和Android中加载需要花费一些时间，但是，在Android中，它也隐藏了导航栏和后退按钮，但是，在iOS中，导航始终显示。

但是，如果我注释了Webview代码，则会立即显示导航标题和后退按钮。

我尝试使用一些标志值，但是，它抛出错误。

constructor(props) {
    super(props);
    this.state = {
     shouldShowWebView: false,
    };

  componentDidMount() {
    this.setState({
      shouldShowWebView: true,
    });
  }

     render() {
const injectedJs = `
    window.postMessage(window.location.href);
  `;
    const {
      shouldShowWebView,
    } 

      <SafeAreaView style={{ flex: 1, backgroundColor: '#fff' }}>
        <View style={styles.container}>
          <View style={styles.headerView}>
            <View style={styles.navigationActionBar}>
              <View style={styles.backButtonContainer}>
                <IconButton
                  style={styles.backBtn}
                  image={images.back}
                  pressed={handlerGo}
                />
              </View>
            <WebView
              source={{ uri: 'someURL' }}
              style={styles.webView}
              onLoad={() => this.hideSpinner()}
              injectedJavaScript={injectedJs}
              scalesPageToFit
              onNavigationStateChange={this.handleNavigationStateChange}
              ref={(ref) => { this.webview = ref; }}
              onError={(err) => {
              }}
            />
        </View>
      </SafeAreaView>
    );
  }

在样式类中

webView: {
    backgroundColor: 'white',
    height: '75%',
    width: '100%',
    marginBottom: 20,
  },

我的要求是，它不应该隐藏导航栏和后退按钮，这在iOS中可以正常工作。

问题仅在Android设备上发生。

有什么建议吗？

一段时间后如何在渲染方法React Native中加载Webview

0 个答案: