onMessage 回调设置状态时重新加载 Webview

Question

我正在使用 React 本机 Webview 来加载我的 Web 应用程序。我正在使用 window.postMessage 从我的网络应用程序发布消息，并且我已经实现了 onMessage 回调

render(){
   return <View>
     <Text>{this.state.messageFromWebview}</Text>
     <WebView onMessage={this.onWebViewMessage} source={{uri: webAppUri}} />
   </View>;
}

在onWebViewMessage函数中，在做

onWebViewMessage=(event)=>{
   this.setState({
    messageFromWebview: event.nativeEvent.data
   })
}

以上代码进入无限循环。在设置状态时，Webview 会重新渲染并调用触发 setState 的 post 消息。

有没有其他选择，或者我在这里遗漏了什么。是否可以将 <Text/> 设置为来自 webview 的消息，而无需重新渲染 Webview。

Answer 1

我认为无限循环是因为在没有 const 请求的情况下调用事件。您需要做的就是在 setState 之前添加 const 变量。以下代码适用于我。

onWebViewMessage = (event) => {    
  // set const data
  const WishData = event.nativeEvent.data;
  // then excuting setState the constant data here
  this.setState({ 
    messageFromWebview: WishData 
  });
}