React native 将数据从React本机组件发送到WebView

我真的尝试在我的react原生组件和我的webview之间建立连接，但没有成功。你有什么解决办法吗？这是我的密码：

      let Script = ` 

  document.getElementById("input").addEventListener("focus", function(data) 
                         {alert(data.data)})

   `;

  render(){
       return(
     <View>
    <WebView
  style={{ flex: 1 }}
  source={{
    html:
      '</br></br></br></br><form > <input id="input" class="input" 
    type="text" 
    placeholder="Product barcode "/></form>'
  }}
  keyboardDisplayRequiresUserAction={false} //ios
  autoFocus={true} //android
  injectedJavaScript={Script1}
  automaticallyAdjustContentInsets={false}
  allowFileAccessFromFileURLs={true}
  scalesPageToFit={false}
  mixedContentMode={"always"}
  javaScriptEnabled={true}
  javaScriptEnabledAndroid={true}
  startInLoadingState={true}
  onMessage={event => {

  alert("HI")

  }}
  onLoad={() => {}}
  />      
    <Button
        onPress={ this.refs.WEBVIEW_REF.postMessage("Hello from RN");}
        title="Scan Barcode"
        color="#6495ED"
      />
   </View> }) 

let Script=`
document.getElementById（“输入”）.addEventListener（“焦点”），函数（数据）
{警报（data.data）}）
`;
render（）{
返回(
{
警报（“HI”）
}}
onLoad={（）=>{}
/>      
}) 

---

我只想在单击按钮后发送警报，以便在我聚焦WebView的输入时发出警报。

您可以尝试将WebView包装到中。

谢谢您的回复，但我认为这不是一个好的解决方案，因为我使用的是生成的WebView，它不像这里的示例那样简单。因此，我寻找一个解决方案，可以适用于所有类型的网络视图，你使用它吗？