--- name: react-native-web-navigation user-invocable: false description: Use when implementing navigation in React Native Web projects. Provides patterns for React Navigation, deep linking, and web-specific routing. allowed-tools: - Read - Write - Edit - Bash - Grep - Glob --- # React Native Web - Navigation Navigation patterns for React Native Web using React Navigation, supporting both native and web platforms with a unified API. ## Key Concepts ### React Navigation React Navigation is the standard navigation library for React Native and React Native Web: ```typescript import { NavigationContainer } from '@react-navigation/native'; import { createNativeStackNavigator } from '@react-navigation/native-stack'; const Stack = createNativeStackNavigator(); export function App() { return ( ); } ``` ### Type-Safe Navigation Define navigation types for type safety: ```typescript import type { NativeStackScreenProps } from '@react-navigation/native-stack'; type RootStackParamList = { Home: undefined; Details: { id: string; title: string }; Profile: { userId: string }; }; type HomeProps = NativeStackScreenProps; type DetailsProps = NativeStackScreenProps; function HomeScreen({ navigation }: HomeProps) { return (

react-native-web-navigation

Install this skill

Comments