随着 React 在前端开发中越来越流行，各种各样的设计模式及新概念亦层出不穷。本文旨在总结 React 开发中一些常见的设计模式。 React 组件可以是有状态的，在其生命周期内可以操纵并改变其内部状态；React 组件也可以是无状态的，它仅接受来自父组件传入的 props，…

目录内容1.JSX语法JSX语法的解析规则是：遇到XML标签<...>，以XML规则解析；遇到代码块{...}，就用JavaScript规则解析；我认为，在JSX中，XML可以理解为是创建虚拟DOM对

这篇文章源自 Dan 的博客。 现在的热点是 hooks，所以 Dan 决定写一篇关于 class 组件的文章 😂。 文章中描述的问题，应该不会影响你写代码；不过如果你想深入研究 React 是怎么工作的，这篇文章可能会对你有帮助。 2015 年初的时候，React 0.13…

多年来，我致力于一系列处理组件 API 和构建应用程序、库的模式。以下是一系列如何设计组件 API 的想法、观点和建议，这会让组件更灵活、更具有组合性、更容易理解。这些规则都不是硬性的，但它们帮助我想明白了如何组织和创建组件。 正如 React 库本身的目标是 最少化 API …

单一职责原则（SRP - single responsibility principle）是编写 React 组件时的基础原则。 所谓职责可能指的是渲染一个列表、显示一个时间选择器、发起一次 HTTP 请求、描绘一幅图表，或是懒加载一个图片等等。组件应该只选择一个职责去实现。当…

在使用React中，你是否会出现过一个文件的代码很多，既存在应用数据的读取和处理，又存在数据的显示，而且每个组件还不能复用。 首先我们来看一个容器组件和展示组件一起的例子吧。 大家可以看到这个例子是没有办法复用的，因为数据的请求和数据的展示都在一个组件进行，要实现组件的复用，我…