React Native Expo 项目在重新加载时显示“屏幕不存在”

Question

我正在尝试在 Android 模拟器上使用基于 expo-router 文件的路由来创建一个 React Native expo 项目。当我开始添加新路线时，一切正常，直到我重新加载模拟器。当应用程序重新加载时，我会看到“此屏幕不存在”。页。

我目前只有 2 条路线，一条配置文件路线作为名为“two.tsx”的默认路线之一的文件夹。

app
├── (tabs)
│   ├── profile
│   │   ├── index.tsx
│   │   └── _layout.tsx
│   ├── two.tsx
│   └── _layout.tsx
├── +html.tsx
├── +not-found.tsx
├── modal.tsx
└── _layout.tsx

我在任何地方都没有找到任何解决方案。我尝试删除（选项卡）文件夹 _layout.tsx 文件中的所有路由，因为我才刚刚启动该项目，但仍然得到相同的结果。

应用程序/（选项卡）/_layout.tsx：

import React from 'react';
import FontAwesome from '@expo/vector-icons/FontAwesome';
import { Link, Tabs } from 'expo-router';
import { Pressable } from 'react-native';

import Colors from '@/constants/Colors';
import { useColorScheme } from '@/components/useColorScheme';
import { useClientOnlyValue } from '@/components/useClientOnlyValue';

// You can explore the built-in icon families and icons on the web at https://icons.expo.fyi/
function TabBarIcon(props: {
  name: React.ComponentProps<typeof FontAwesome>['name'];
  color: string;
}) {
  return <FontAwesome size={28} style={{ marginBottom: -3 }} {...props} />;
}

export default function TabLayout() {
  const colorScheme = useColorScheme();

  return (
    <Tabs
      screenOptions={{
        tabBarActiveTintColor: Colors[colorScheme ?? 'light'].tint,
        // Disable the static render of the header on web
        // to prevent a hydration error in React Navigation v6.
        headerShown: useClientOnlyValue(false, true),
      }}>
    </Tabs>
  );
}

我删除了旧路由指向的所有文件，结果相同。我尝试查找任何推送到页面的文件，但我的项目中没有任何文件。

我什至尝试删除整个项目并重新开始，但结果仍然相同。

这是 Github，SSDEMO 文件夹包含该问题：https://github.com/ChaseHutcheson/React-Native

Answer 1

我认为你需要确保每个文件夹中都存在index.tsx，这将指向相对根路径。

https://docs.expo.dev/router/create-pages/