通过webview实现app和h5之间的传值

我这的app是react-native项目，h5是react项目，

{flex:1,width}}source={{uri: 'url'}}  //这里的url是h5的url// scrollEnabled={false} // javaScriptEnabled={true}// injectedJavaScript={}ref='webview'onLoadEnd={() => {// this.refs.webView.postMessage('RN向H5发送的消息');}}onMessage={(event) => {console.log(event.nativeEvent.data)}}
/>
{height: 44, alignItems:'center'}} onPress={this.qiehuan}>切换

一、rn->h5
1、rn 发送

qiehuan = ()=>{this.refs.webview.postMessage('RN向H5发送的消息');}

2、h5 接收

onReceiveMessage =  (event) => {alert(event.data)this.setState({event:event.data})console.log(event.data)};componentWillUnmount() {window.removeEventListener('message', this.onReceiveMessage)}componentDidMount() {window.addEventListener('message', this.onReceiveMessage, false);}

二、h5->RN
1、h5发送

postMessage = ()=>{if(window.ReactNativeWebView){window.ReactNativeWebView.postMessage('网页向rn发送的消息');}}

2、rn接收

onMessage={(event) => {console.log(event.nativeEvent.data)
}}

当时做的时候也是遇到了很多问题，找人请教了之后才成功的，现在和大家分享一下，希望对大家有所帮助。

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！