React Native View Renderowanie

Question

Jak mogę renderować widoki warunkowo? Przykład: jeśli moja aplikacja nie ma połączenia z internetem - wyświetla widok błędu, jeśli jest połączony - renderuje WebView? Czy to możliwe z reakcją natywną? Chcę renderować nie czysty html

Answer 1

Logic renderowanie widoki warunkowo, za pomocą przykładu:

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

Answer 2

W swojej metodzie renderowania można zdefiniować warunkowe, takie jak poniższy przykład. Na przykład możesz sprawdzić połączenie przy użyciu metody componentDidMount, a następnie ustawić rekwizyty.

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

Answer 3

Jeśli jest to specyficzne dla WebView, składnik ten zawiera dwie funkcje renderowania.

renderError funkcja

Funkcja, która zwraca widoku, aby pokazać, jeśli wystąpi błąd.

renderLoading funkcja

funkcję zwracającą wskaźnik ładowania.

WebView Component Docs.

Z funkcją renderError można powrócić do widoku wskazane jest błąd w tym aplikacji nie jest podłączony do Internetu.