React Native中window.open报错原因？Expo Router外部URL跳转问题咨询

为什么window.open无法工作？ #

React Native（包括Expo）的运行环境并非浏览器，而是基于JavaScript引擎（如Hermes或JSC）的原生容器。虽然环境中存在window对象，但它只是一个简化的模拟版本，不包含浏览器特有的window.open API——这个API是浏览器用来打开新标签页/窗口的，而React Native应用没有浏览器的窗口/标签页概念，所以该方法自然不存在，调用时就会抛出"undefined is not a function"错误。

正确打开外部URL的方法 #

在Expo/React Native中，打开外部URL需要使用官方提供的Linking API，这是专门用于处理应用内跳转、外部链接打开的工具。

具体实现步骤： #

1. 导入Linking模块：

import { Linking } from 'react-native';

2. 在按钮点击事件中调用Linking.openURL()：

const handleOpenExternalUrl = async () => {
  const url = 'https://example.com';
  // 先检查设备是否支持打开该URL
  const supported = await Linking.canOpenURL(url);
  if (supported) {
    await Linking.openURL(url);
  } else {
    console.error(`无法打开URL: ${url}`);
  }
};

3. 按钮组件使用示例：

<Button title="打开外部链接" onPress={handleOpenExternalUrl} />

关于Expo Router说明 #

Expo Router的router.push、router.replace等方法确实仅用于跳转应用内部定义的路由（即app/目录下的页面），无法直接打开外部URL。处理外部链接必须搭配Linking API使用，二者分工明确：内部路由用Expo Router，外部URL用Linking。

内容的提问来源于stack exchange，提问作者Riz