Reactive Native View Rendern

Question

Wie kann ich Ansichten bedingt rendern? Beispiel: Wenn meine App nicht mit dem Internet verbunden ist - render error view, falls verbunden - render WebView? Ist das möglich mit reagieren nativ? Ich möchte nicht rein html

Answer 1

Logic Ansichten bedingt zu machen, Ihr Beispiel mit:

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

Answer 2

In Ihrer Rendermethode können Sie Bedingungen wie das folgende Beispiel definieren. Zum Beispiel können Sie Ihre Verbindung bei der Methode componentDidMount überprüfen und dann Ihre Requisiten setzen.

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

Answer 3

Wenn es spezifisch für das WebView ist, enthält diese Komponente zwei Renderfunktionen.

renderError Funktion

Funktion, die eine Ansicht kehrt zu zeigen, wenn ein Fehler vorliegt.

renderLoading Funktion

Funktion, die eine Ladeanzeige zurückgibt.

WebView Component Docs.

Mit renderError Funktion können Sie eine Ansicht zurückkehren können angezeigt gibt es einen Fehler der App mit nicht mit dem Internet verbunden.