/Javascript/React/How to give data from react native to webview

How to give data from react native to webview

// Native
this.webviewRef.postMessage('Wayne is coming!!!')

// Web
window.addEventListener("message", message => {
  console.log(message.data) // Wayne is coming!!!
});

Source: stackoverflow.com

How to give data from react native to webview

// Web App
<button onClick={() => {
  if(window.ReactNativeWebView) { // ensure window.ReactNativeWebView is there, otherwise, web app might crash if is not there
    window.ReactNativeWebView.postMessage('Wayne is coming again')
  }
}}>
</button>

// Native App
<WebView
  onMessage={(event) => {
    console.log(event.nativeEvent.data) // Client received data
  }}
  source={{ uri: 'https://your.domain.com' }}
/>

Source: stackoverflow.com

Similar codes

0 vote268 views1 answer
Custom react native product rating
Javascript React
0 vote224 views1 answer
React js bootstrap select option required
Javascript React
1 vote195 views1 answer
React router dom 6 go back
Javascript React
3 votes196 views2 answers
React get data attribute from element
Javascript React
0 vote184 views1 answer
Check scroll top height in react js
Javascript React
112 votes244 views6 answers
Import bootstrap 4 in react
Javascript React
4 votes217 views1 answer
How to add oAuth google signin in react native app
Javascript React
18 votes187 views6 answers
React native create apk
Javascript React
32 votes185 views2 answers
Npm react router dom@5
Javascript React
0 vote183 views1 answer
React router dom default params
Javascript React