【问题标题】:How do you structure components and screens when using expo, native-base and react-navigate?使用 expo、native-base 和 react-navigate 时如何构建组件和屏幕?
【发布时间】:2020-06-03 15:10:33
【问题描述】:

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

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

提前致谢!

【问题讨论】:

    标签: react-native expo react-navigation native-base


    【解决方案1】:

    通常文件结构有点像这样:

    • node_modules
    • 世博会
      • 屏幕
      • 组件
    • app.js
    • package.json
    • package-lock.json

    当您最初执行expo start 时,src 文件夹将不存在。 你必须成功。

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

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

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

    【讨论】:

    • 抱歉,没有看到您的编辑。非常感谢!那么我的 App.js 文件应该包含什么才能同时使用 react-navigate 屏幕和原生组件?
    • 您的 app.js 文件可以包含 react-navigation 对象,您可以从屏幕目录中导入您计划使用的所有屏幕。无论您需要在何处使用组件,都可以在任何屏幕中导入原生基础元素。这能回答你的问题吗?
    猜你喜欢
    • 1970-01-01
    • 2023-01-15
    • 2018-11-18
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-12-31
    • 2022-01-20
    • 2022-09-29
    相关资源
    最近更新 更多