使用 expo、native-base 和 react-navigate 时如何构建组件和屏幕?

How do you structure components and screens when using expo, native-base and react-navigate?

刚开始尝试使用 React Native 构建应用程序。我决定使用 expo + react-navigate + native-base 作为基准,但是我在设置我的项目时遇到了问题,因为每个文档似乎都在做不同的事情。

具体来说,我想知道在 react-navigate 中将组件(例如搜索栏)和不同屏幕的代码保存在哪里。 react-navigate 的文档似乎将所有屏幕都保存在 App.js 文件中,但我不应该将不同的屏幕分成子文件夹中的不同 .js 文件吗? native-base 的文档完全更改了 App.js 文件,因此我不知道如何在其中实现屏幕。我能找到的所有指南似乎都已过时或未使用 expo 文件结构,因此我无法正常运行设置。

提前致谢!

通常文件结构是这样的:

  • node_modules
  • 博览会
  • 来源
    • 屏幕
    • 组件
  • app.js
  • package.json
  • 包-lock.json

最初 expo start 时,src 文件夹不会存在。 你必须成功。

一般把你用到的组件放在src文件夹的components目录下,screens放在screens目录下。 screens 目录中的屏幕使用 components 目录中的组件。

app.js 文件通常用于您希望在应用程序启动时显示的初始屏幕。但大多数人也将此 app.js 文件制作成导航器文件,您可以在其中导入所有导航屏幕。

请记住,这些规则只是惯例,您也可以根据自己的方便进行自定义。