Native reagieren - WebView

In diesem Kapitel erfahren Sie, wie Sie WebView verwenden. Es wird verwendet, wenn Sie eine Webseite inline für Ihre mobile App rendern möchten.

Verwenden von WebView

Das HomeContainer wird eine Containerkomponente sein.

App.js.

import React, { Component } from 'react'
import WebViewExample from './web_view_example.js'

const App = () => {
   return (
      <WebViewExample/>
   )
}
export default App;

Lassen Sie uns eine neue Datei namens erstellen WebViewExample.js in der src/components/home Mappe.

web_view_example.js

import React, { Component } from 'react'
import { View, WebView, StyleSheet }

from 'react-native'
const WebViewExample = () => {
   return (
      <View style = {styles.container}>
         <WebView
         source = {{ uri:
         'https://www.google.com/?gws_rd=cr,ssl&ei=SICcV9_EFqqk6ASA3ZaABA#q=tutorialspoint' }}
         />
      </View>
   )
}
export default WebViewExample;

const styles = StyleSheet.create({
   container: {
      height: 350,
   }
})

Das obige Programm generiert die folgende Ausgabe.