React NativeとWebViewでいつでも双方向通信する
最近仕事で React を使うようになりました。
で、React Native アプリ(以下 RN)と WebView(以下 WV)の双方向でメッセージをやり取りしたかった。
公式ドキュメントの奥深く、Communicating between JS and Nativeに書いてある。
というわけで、いつでも双方向通信を実現してみた。
動作確認
* react-native: 0.63.2
* react-native-webview: 10.8.3
ReactNative 側のソース
react-nativeのWebViewはディスコンらしい。
ので react-native-webviewのWebViewを使います。
sourceプロパティで Web ページを埋め込むのですが、localhostじゃ動きません。
アドレスを指定しましょう。動作検証するためにはこのアドレスが RN 側の端末で解決できる必要があります。
import React, { useState } from 'react'
import