React Native webview onNavigationStateChange 没有在网络应用程序（chrome）中被调用

Question

我正在开发一个React Native应用程序，它使用react-native-webview来加载第三方URL。我实现了 onNavigationStateChange 回调来根据 URL 的状态处理导航。这在移动设备上运行良好，但我注意到当使用react-native-web在网络上运行相同的代码时，回调不会触发。

问题描述 我想根据 WebView 中加载的 URL 导航回主屏幕。我当前的实现使用 onNavigationStateChange 来检查 URL 中的特定关键字，但这种方法似乎不适用于网络。

import React from 'react';
import { WebView } from 'react-native-webview';
import { useNavigation } from '@react-navigation/native';

const MyWebView = () => {
  const navigation = useNavigation();
  const redirectUrl = 'https://example.com';

  const handleNavigationStateChange = (newNavState) => {
    const { url } = newNavState;

    if (url && url.includes('success')) {
      navigation.getParent().goBack();
    } else if (url && url.includes('failure')) {
      navigation.goBack();
    }
  };

  return (
    <WebView
      source={{ uri: redirectUrl }}
      onNavigationStateChange={handleNavigationStateChange}
    />
  );
};

export default MyWebView;

问题

1. 为什么 onNavigationStateChange 在移动设备上完美运行时却无法在 Web 上触发？
2. 处理 URL 是否有任何替代方案或最佳实践 在网络上运行时 WebView 会发生变化吗？

任何见解或建议将不胜感激！

Answer 1

我也有同样的问题。我使用 React Native Web WebView libray 进行 Web 应用程序，但 onNavigationStateChange 未触发，如果有人有任何想法，请提出建议