/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 vote293 views1 answer
React hooks, react custom hooks
Javascript React
0 vote268 views1 answer
React native bootstrap
Javascript React
0 vote303 views1 answer
.env not working on react
Javascript React
0 vote300 views1 answer
Cookies in react native
Javascript React
4 votes263 views1 answer
React router dom v6 goback
Javascript React
0 vote333 views1 answer
How to change height of bottom material tab navigator from react-naviagtion
Javascript React
0 vote319 views1 answer
HandleClickoutside custom hook react
Javascript React
31 votes319 views1 answer
Install react router dom and save
Javascript React
0 vote323 views1 answer
@types react-router-dom
Javascript React
0 vote308 views2 answers
Airbnb and eslint react native
Javascript React