第一步

对照官网 跑通开发环境（官网教程非常详细不再赘述）

运行npx react-native@latest init YourProjectName，等待一段时间后 运行cd YourProjectName & yarn android进入项目，编译项目

第二步

• 用android studio软件打开项目中的adnroid文件夹，刚进入会自动启动gradle编译，如果没有自行点击右上角的小象图标，如果报错，找到prefrences设置项，检查gradle jdk的版本设置是否有误
• gradle编译成功后，我们可以配置app的图标和名称
  1. 进入YourProjectName>android>app>src>main>res>values>strings.xml文件设置app名称
  2. 进入YourProjectName>android>app>src>main>res>mipmap文件夹里设置app图标

完成这一切后，保存，重新运行yarn android你会发现你的app图标和名称都变了 至此前置配置结束，可以进入src目录正式开发了

第三步

1. 删除App.tsx默认内容，只保留基本框架

import React from 'react';
import {
  SafeAreaView,
  StatusBar,
} from 'react-native';
import {
  Colors,
} from 'react-native/Libraries/NewAppScreen';

function App(): React.JSX.Element {
  return (
    <SafeAreaView>
      <StatusBar
        barStyle={'dark-content'}
        backgroundColor={Colors.lighter}
      />
    </SafeAreaView>
  );
}


export default App;

2. 接下来我们需要引入路由来管理我们的页面
   • 引入路由相关的npm工具包
     • @react-navigation/bottom-tabs (底部tab页)
     • @react-navigation/native （）
     • @react-navigation/stack
     • react-native-gesture-handler
     • react-native-screens
     • react-native-safe-area-context
   • 接下来有必要介绍一下react-navigation库中提供的关于路由使用的方法

     • push 每运行一次push，路由栈中就会多一条页面记录

     • navigatenavigate方法和push一样，也是往栈中添加页面记录，不同的是，会先判断路由栈中是否已经有当前的页面记录，有的话就路由指针直接回到重复的位置而不会添加新的记录了，没有的话才会添加新的记录，你可以暂时理解为类似于去重一样

     • relace replace顾名思义代替，他不会创建新的路由记录，而是代替，比如A页面跳转B页面，路由栈中会将A的页面记录删除，用B的页面记录替代

     • pop 页面回退没啥好说的

     • goBack 和pop唯一不同的是它可以在tab页中使用