React Native Webview 处理 url 更改侦听器

Question

可以在 React Native Web 视图上处理 URL 更改。

我尝试处理onNavigationStateChange听众。但它只有一次发射。当页面加载时触发 onNavigationStateChange。当我导航到另一个页面时，此事件不会触发。

任何的想法？

Answer 1

参考import { WebView } from 'react-native-webview'您可能正在使用旧版本的 webview，请尝试更新或尝试按照以下方式code/method获取当前导航path/url。

在您的情况下onNavigationStateChange，不返回导航路径，因此您可以尝试使用onLoadProgress它返回 url 中的每个更改。

而不是这个

 onNavigationStateChange={(state) => {
  console.log("current_path",path);

 }}

尝试这个

这可能会被多次调用，请相应地处理您的情况。

 onLoadProgress={({ path}) => {
 console.log("current_path",path);
 }}

这就是我的 WebView 的样子

  <WebView
    source={{ uri: this.state.url }}
    onLoadEnd={() => this.hideSpinner()}
    onMessage={onMessage.bind(this)}
    ref={WEBVIEW_REF => (this.WebViewRef = WEBVIEW_REF)}
    startInLoadingState={true}
    javaScriptEnabled={true}
    domStorageEnabled={true}
    onLoadProgress={({ nativeEvent }) => {
       //your code goes here       
    }}
    onNavigationStateChange={(state) => {
       //your code goes here       
    }} 
   />

Answer 2

尝试升级您的 React Native（和 React）版本。它应该被修复。也许是一个老问题，因为现在它工作正常。

检查此链接：React Native webview get url