React Native - WebView

• 

  简述

  在本章中，我们将学习如何使用 WebView。当您想要将网页呈现到您的移动应用程序内联时使用它。
• 

  使用 WebView

  HomeContainer将是一个容器组件。

  app.js

  
  import React, { Component } from 'react'
  import WebViewExample from './web_view_example.js'
  const App = () => {
     return (
        <WebViewExample/>
     )
  }
  export default App;
  

  让我们创建一个名为的新文件WebViewExample.js在 - 的里面src/components/home文件夹。

  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=jc2182' }}
           />
        </View>
     )
  }
  export default WebViewExample;
  const styles = StyleSheet.create({
     container: {
        height: 350,
     }
  })
  

  上述程序将生成以下输出。