React Native – WebView

React Native WebView is a component to render the web page into your mobile app. This is supported by Android and IOs both. WebView is very useful as you can open any web link in your app itself so when anybody wants to browse your referred link they don’t need to open any other app for that.

import { WebView} from 'react-native-webview'
sourceinjectJavaScriptinjectedJavaScriptonError
onLoadonLoadEndonLoadStartonMessage
originWhitelistrenderErrorstyleuserAgent
htmlurlgeolocationEnabledscrollEnabled
contentInsetbouncesallowFileAccessnativeConfig
Props
<WebView source={{uri: 'https://blog.codehunger.in'}}/>

To use WebView you need to install react-native-webview dependency.

npm install react-native-webview --save

After the updation of React Native 0.60, they have introduced autolinking so we do not require to link the library but need to install pods. So to install pods use

cd ios && pod install && cd ..
//This is an example code to understand WebView// 

import React, { Component } from 'react';
//import react in our code. 

import { WebView } from "react-native-webview";
//import all the components we are going to use. 

export default class App extends Component {
  render() {
    return (
       <WebView
        source={{uri: 'https://blog.codehunger.in'}}
        style={{marginTop: 20}}
      />
    );
  }
}

0 0 votes
Article Rating

Do you want to hire us for your Project Work? Then Contact US.
Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x