我可以在模态中使用堆栈导航吗？

Question

我想通过react-native将Stacks放入Modal中。

我尝试将堆栈导航器放在模态中，但我无法按可按元素，例如 TouchableOpacity 或 Pressable 等...

ps。如果无法将堆栈放入 Modal，请告诉我如何在 React-navigation 中制作全屏模态。

Answer 1

我在 GitHub 上遇到了类似的问题，并通过 @leggomuhgreggo 找到了这个解决方案：

树

app
| -- modal-stack
|    |-- _layout.tsx
|    |-- modal-screen-1.tsx
|    |-- modal-screen-2.tsx
| -- _layout.tsx
| -- index.tsx

应用程序/模态堆栈/_layout.tsx

// app/modal-stack/_layout.tsx
import { Stack } from 'expo-router/stack';

export const unstable_settings = {
  // Ensure that reloading on `/modal` keeps a back button present.
  initialRouteName: 'modal-screen-1',
};


export default function Layout() {
  return (
    <Stack>
      <Stack.Screen name="modal-screen-1" />
      <Stack.Screen name="modal-screen-2" />
    </Stack>
  );
}

应用程序/_layout.tsx

// app/_layout.tsx

import { Stack } from 'expo-router';

export {
  // Catch any errors thrown by the Layout component.
  ErrorBoundary,
} from 'expo-router';

export default function  RootLayoutNav() {
  return (
      <Stack>
        <Stack.Screen name="index" options={{ headerShown: false }} />
        <Stack.Screen name="modal-stack" options={{ headerShown: false, presentation: 'modal' }}/>
      </Stack>
  );
}

来源：世博路由器问题#512