首选的React Native导航库

React Native有许多不错的导航库可供选择，以下是其中一些首选的React Native导航库和相应的代码示例：

1. React Navigation: React Navigation是一个由React Native社区维护的流行导航库，用于构建跨平台导航。

安装React Navigation：

npm install @react-navigation/native
npm install react-native-reanimated react-native-gesture-handler react-native-screens react-native-safe-area-context @react-native-community/masked-view

创建一个基本的导航：

import * as React from 'react';
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';

import HomeScreen from './HomeScreen';
import DetailsScreen from './DetailsScreen';

const Stack = createStackNavigator();

function App() {
  return (
    <NavigationContainer>
      <Stack.Navigator>
        <Stack.Screen name="Home" component={HomeScreen} />
        <Stack.Screen name="Details" component={DetailsScreen} />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

export default App;

2. React Native Navigation (Wix): React Native Navigation是由Wix开发的另一个流行的导航库，提供原生导航体验。

安装React Native Navigation：

npm install @react-native-community/masked-view
npm install @react-navigation/native
npm install react-native-reanimated react-native-gesture-handler react-native-screens react-native-safe-area-context

创建一个基本的导航：

import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';

import HomeScreen from './HomeScreen';
import DetailsScreen from './DetailsScreen';

const Stack = createNativeStackNavigator();

function App() {
  return (
    <NavigationContainer>
      <Stack.Navigator>
        <Stack.Screen name="Home" component={HomeScreen} />
        <Stack.Screen name="Details" component={DetailsScreen} />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

export default App;

3. React Native Router Flux: React Native Router Flux是一个基于React Native的导航库，提供简单的API和易于使用的导航。

安装React Native Router Flux：

npm install react-native-router-flux

创建一个基本的导航：

import React from 'react';
import { Router, Scene } from 'react-native-router-flux';

import HomeScreen from './HomeScreen';
import DetailsScreen from './DetailsScreen';

function App() {
  return (
    <Router>
      <Scene key="root">
        <Scene key="home" component={HomeScreen} initial />
        <Scene key="details" component={DetailsScreen} />
      </Scene>
    </Router>
  );
}

export default App;

以上是三个常用的React Native导航库和相应的代码示例。你可以根据自己的需求选择其中一个来实现导航功能。