React Native View Render

how can I render views conditionally? Example: if my app has not connected to internet - render error view, if connected - render WebView? Does that possible with react native? I want to render not pure html



Logic to render views conditionally, using your example:

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

In your render method , you can define conditionals like the example below. For instance, you may check your connection at componentDidMount method and then set your props.

          if(this.state.isConnected == 'Online' )
            return this.webView();
            return this.renderAnotherView();

If it's specific to the WebView, this component contains two render functions.

renderError function

Function that returns a view to show if there's an error.

renderLoading function

Function that returns a loading indicator.

WebView Component Docs.

With renderError function you can return a view indicated there's an error including the app is not connected to the internet.


Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.