diff --git a/zh-cn/react-native-screens.md b/zh-cn/react-native-screens.md index fc118f1bbb05a00f66fd4895c136d18b70f7db0b..e84fdcbfb92e2f112060395222f57e70da7081f5 100644 --- a/zh-cn/react-native-screens.md +++ b/zh-cn/react-native-screens.md @@ -1,5 +1,4 @@ - -> 模板版本:v0.1.3 +> 模板版本:v0.2.2

react-native-screens

@@ -8,11 +7,13 @@ Supported platforms - + License

+> [!tip] [Github 地址](https://github.com/software-mansion/react-native-screens) + ## 安装与使用 进入到工程目录并输入以下命令: @@ -22,12 +23,8 @@ #### **npm** ```bash -npm install @react-navigation/bottom-tabs npm install @react-navigation/native -npm install @react-navigation/native-stack -npm install @react-navigation/stack -npm install @react-native-oh-tpl/react-native-gesture-handler -npm install react-native-reanimated +npm install @react-native-oh-tpl/stack npm install @react-native-oh-tpl/react-native-safe-area-context npm install react-native-screens ``` @@ -35,80 +32,78 @@ npm install react-native-screens #### **yarn** ```bash -yarn add @react-navigation/bottom-tabs yarn add @react-navigation/native -yarn add @react-navigation/native-stack yarn add @react-navigation/stack -yarn add @react-native-oh-tpl/react-native-gesture-handler -yarn add react-native-reanimated yarn add @react-native-oh-tpl/react-native-safe-area-context yarn add react-native-screens ``` -声明:[@react-native-oh-tpl/react-native-safe-area-context](/zh-cn/react-native-safe-area-context.md)和[@react-native-oh-tpl/react-native-gesture-handler](/zh-cn/react-native-gesture-handler.md)需要进行额外的配置,详情请去对应的文档查看。 - 下面的代码展示了这个库的基本使用场景: +> [!WARNING] 使用时 import 的库名不变。 + ```js -import React from "react"; -import { NavigationContainer, ParamListBase } from "@react-navigation/native"; -import { ScrollView, Button, Tesxt } from "react-native"; -import { NativeStackNavigationProp } from "react-native-screens"; -import { createBottomTabNavigator } from "@react-navigation/bottom-tabs"; -import { createStackNavigator } from "@react-navigation/stack"; +import React from 'react'; +import {ScrollView, Button, View, Text} from 'react-native'; +import {NavigationContainer} from '@react-navigation/native'; +import {createStackNavigator} from '@react-navigation/stack'; import { enableScreens } from "react-native-screens"; enableScreens(false); +function Home({navigation}) { + return ( + + + Home Screen + +