React 是一种流行的前端 JavaScript 库，它提供了构建用户界面的高效和灵活的方式。但是，如果你想更深入地了解 React 的核心概念，你可能需要掌握一些更高级的特性和技巧。
在本文中，我们将介绍 React Bits 的中文翻译版，并深入探讨其中所包含的各种 React 技术，例如：
- render props 模式
- 高阶组件模式
- 受控组件与非受控组件
- 组件通信模式
- 状态管理库的使用及其优缺点
Render Props 模式
Render Props 是 React 中一种常见的模式，它允许您从一个组件向子组件传递函数或对象，以便让子组件可以访问到一些数据或状态。Render Props 模式非常适用于那些有类似功能的组件之间进行复用的情况。
下面是一个例子，其中父组件 Mouse 使用 Render Props 将鼠标位置的信息传递给子组件 Cat。
-- -------------------- ---- -------
----- ----- ------- --------------- -
------------------ -
-------------
-------------------- - --------------------------------
---------- - - -- -- -- - --
-
---------------------- -
---------------
-- --------------
-- -------------
---
-
-------- -
------ -
---- -------- ------- ------ -- -----------------------------------
-------------------------------
------
--
-
-
----- --- ------- --------------- -
-------- -
----- ----- - -----------------
------ -
---- -------------- -------- --------- ----------- ----- -------- ---- ------- -- --
--
-
-
----- --- ------- --------------- -
-------- -
------ -
---- -------- ------- ------ ---
------ ------------- -- -
---- ------------- --
----
------
--
-
-高阶组件模式
高阶组件（Higher Order Component，简称 HOC）是一种函数，它接收一个组件并返回一个新的增强版组件。使用 HOC 的主要好处在于可以将某些代码逻辑从一个组件中抽离出来，在需要的时候可以轻松地重用。
下面是一个例子，其中 withFetch 是一个 HOC，它将数据获取逻辑提取到一个单独的组件中。
-- -------------------- ---- -------
-------- -------------- -
------ -------------------------- -
----- --------- ------- --------------- -
------------------ -
-------------
---------- - -
----- -----
---------- -----
------ ----
--
-
------------------- -
----------
-------------- -- ----------------
---------- --
---------------
----- -----
---------- -----
--
-
------------ --
---------------
------ ------
---------- -----
--
--
-
-------- -
------ ----------------- --------------- --------------- ---
-
-
------ ----------
--
-
----- ----------- ------- --------------- -
-------- -
-- ---------------------- -
------ ----------------------
-
-- ------------------ -
------ ------------------
-
------ -
----
------------------------- -- -
--- ------------------------------
---
-----
--
-
-
----- -------------------- - --------------------------------------------------受控组件与非受控组件
React 中的表单元素可以是受控（controlled）的或者是非受控（uncontrolled）的。受控组件需要通过状态来更新表单
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/10943
