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

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

 {
        // this.refs.webView.postMessage('RN向H5发送的消息');
      }}
      onMessage={(event) => {
        console.log(event.nativeEvent.data)
      }}
/>

    切换

一、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)
}}

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

你可能感兴趣的:(通过webview实现app和h5之间的传值)