反应本机视图渲染

React Native View Render

本文关键字：视图 本机      更新时间：2023-09-26

如何有条件地呈现视图？示例：如果我的应用尚未连接到互联网 - 呈现错误视图，如果已连接 - 呈现 WebView？这可以通过本机反应吗？我想渲染不是纯 html

使用您的示例有条件地呈现视图的逻辑：

render() {
  if (!this.state.isConnected) { // error
    return (
      <View></View>
    );
  }
  else {
    return ( // webview
      <WebView />
    );
  }
}

在 render 方法中，您可以定义条件，如下例所示。例如，您可以在 componentDidMount 方法中检查您的连接，然后设置您的 props。

 render(){
          if(this.state.isConnected == 'Online' )
            return this.webView();
          else
            return this.renderAnotherView();
        }

如果它特定于 WebView，则此组件包含两个呈现函数。

渲染错误函数

返回视图以显示是否存在错误的函数。

渲染加载函数

返回加载指示器的函数。

网页视图组件文档。

使用 renderError 函数，您可以返回一个视图，指示存在错误，包括应用程序未连接到互联网。

相关文章：