react 增删改查_React 项目结构和组件命名规范

React 作为一个库，它没有规定项目的整体结构。这很好，因为它给了我们自由去尝试不同的方法，并适应更适合我们的方式。另一方面，这可能会给React领域的开发人员带来一些困惑。

我将会在本文为大家展示我已经使用过一段时间并且效果不错的方式，这些方式没有通过重新造轮子来实现，而是通过将社区中的方案组合和提炼得到。

目录结构

我经常遇到的一个问题是如何组织文件和目录结构。在这篇文章中，我们认为你已有一个最小的结构，就像用 create-react-app 创建的结构一样。

create-react-app 为我们生成了一个基础的项目，包含根目录还有诸如.gitignore, package.json, README.md, yarn.lock 的文件。

它还生成 public和src目录， src目录是我们保存源代码的地方。

请看下面的图片，以及描述的结构：

在这篇文章中，我们只关注src目录，src 之外保持不变。

容器和组件 (Containers and Components)

你可能已经在某些项目的根目录下看到了容器和展示组件之间的分离。我的意思是，在src中，在 src 目录下有 containers目录和 components 目录：

src├─ components └─ containers

但是，这种方法有一些问题，如下所示:

• 主观的规则：对于容器和展示组件，没有明确的规则。彼此之间的差异可能是主观的，当你在一个团队中时，很难让所有开发人员赞成并评判这个问题。
• 它没有考虑组件的动态性：即使当你决定某个组件适合于某个特定类型时，也很容易在项目生命周期中对其进行更改，使其从另一种类型变为另一种类型，最终迫使你把它从 components 挪到 containers 目录下，反之亦然。
• 允许两个具有相同名称的组件：组件的命名在应用程序中具有声