如何在react-native应用中配置react-native导航?



我一直在尝试用react-navigation/stack设置我的导航,但似乎缺少了一些东西。下面是我的代码:

import "react-native-gesture-handler";
import * as React from "react";
import { Button, View, Text } from "react-native";
import { NavigationContainer } from "@react-navigation/native";
import { createStackNavigator } from "@react-navigation/stack";
function HomeScreen({ navigation }) {
return (
<View style={{ flex: 1, alignItems: "center", justifyContent: "center" }}>
<Text>Home Screen</Text>
<Button
title="Go to Details"
onPress={() => navigation.navigate("Details")}
/>
</View>
);
}
function DetailsScreen({ navigation }) {
return (
<View style={{ flex: 1, alignItems: "center", justifyContent: "center" }}>
<Text>Details Screen</Text>
<Button
title="Go to Details... again"
onPress={() => navigation.navigate("Details")}
/>
</View>
);
}
const Stack = createStackNavigator();
export default function App() {
return (
<NavigationContainer>
<Stack.Navigator initialRouteName="Home">
<Stack.Screen name="Home" component={HomeScreen} />
<Stack.Screen name="Details" component={DetailsScreen} />
</Stack.Navigator>
</NavigationContainer>
);
}

当我尝试使用yarm web在web上运行应用程序时应用程序运行完美,但当我使用我的安卓AVD甚至我的真实设备,它给我这个错误:

Failed building JavaScript bundle.
Unable to resolve "@react-native-community/masked-view" from "node_modules@react-navigationstacksrcviewsMaskedViewNative.tsx"

请帮

这里,你必须安装react-native-community/mask -view库,如果你没有安装基础导航库和堆栈导航库所需的其他库,你可能会在其他库中得到相同的错误。

尝试安装库:

如果你使用的是纱线

  • yarn add @react-native-community/mask -view

如果你使用的是npm

  • npm install @react-native-community/mask -view

如果出现这样的错误,请安装其他库。

请参阅文档。您缺少一些依赖项。

installing-dependencies-into-a-bare-react-native-project

最新更新