ตอบสนองเนทีฟ - 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=tutorialspoint' }}
         />
      </View>
   )
}
export default WebViewExample;

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

โปรแกรมข้างต้นจะสร้างผลลัพธ์ต่อไปนี้