组件文件夹或屏幕文件夹？ [关闭]

Question

过去两周我一直在学习 RN，我有以下问题：为什么 SRC 文件夹中有组件文件和屏幕文件？他们不是一样的吗？我见过程序员只使用一个 Screens 文件夹，他们将所有组件都包含在这些屏幕中。我还看到程序员只有一个组件文件夹，屏幕的所有代码都在其中。真的有关系吗？你的偏好是什么？我目前正在处理的项目只有一个屏幕文件夹。

谢谢！

Answer 1

在 React Native 中，您通常会使用 screens/ 文件夹并在其中创建所有组件屏幕。现在，如果您希望创建可重用的组件，那么您可以创建一个 components/ 文件夹并将这些特定组件放在那里。

正如上一个答案所述，对此没有硬性规定，只是约定。

因此，一个很好的用例可能是您希望拥有一个向用户显示一些带有内容的卡片的 UI。您可能有一个screens/ImageScreen.js，它表示这些卡片项目所在的整体布局，但是对于用户将在该屏幕内滚动浏览的每个单独的卡片项目，它可能是一个名为Card.js 或@987654325 的单独组件@ 或任何你想要的，它位于 components/ 文件夹内。

然后在您的主布局或屏幕中，您可以将子项导入父项，例如：

import React from "react";
import { View, Text, StyleSheet } from "react-native";
import ImageDetail from "../components/ImageDetail";

然后您可以像这样在父屏幕中显示该子组件：

const ImageScreen = () => {
  return (
    <View>
      <ImageDetail />
      <ImageDetail />
      <ImageDetail />
      <ImageDetail />
    </View>
  );
};

然后，您可以将来自该父屏幕的道具传递给子组件，以自定义该子组件如何显示自己并向用户显示自己。