React 使用 Effect 同外部系统协作

React 使用 Effect 同外部系统协作

有些组件需要与外部系统同步。例如,可能希望根据 React state 控制非 React 组件、设置服务器连接或在组件出现在屏幕上时发送分析日志。使用 Effects 会在组件渲染后运行一些代码,以便可以将组件与 React 之外的某些系统同步。
阅读更多
React Ref 建立虚拟与真实Dom的链接

React Ref 建立虚拟与真实Dom的链接

如果希望组件“记住”某些信息,但又不想让这些信息触发新的渲染时;如果需要访问由 React 管理的 DOM 元素,比如让一个节点获得焦点、滚动或测量它的尺寸和位置时,都需要借助需要一个指向 DOM 节点的 ref 来实现。
阅读更多
React 利用Reducer管理复杂状态及Context深层传递状态

React 利用Reducer管理复杂状态及Context深层传递状态

对于拥有许多状态更新逻辑的组件来说,过于分散的事件处理程序会增加一定的维护难度。此时,可以将组件的所有状态更新逻辑整合到一个外部函数(称为 reducer)中,进行统一管理。此外,已经学习过,可以通过 props 将属性传递给子组件,但是如果中间通过许多中间组件向下传递 props,或是在应用中的许多组件需要相同的信息,传递 props 会变的十分冗长和不便,此时便可以通过 Context 让父组件向其下层任意深度的任何组件提供所需信息。
阅读更多
React 在组件间共享状态

React 在组件间共享状态

在 React 开发过程中,有时希望两个组件的状态始终同步更改。而要实现这一点,可以将相关 state 从这两个组件上移除,并把 state 放到它们的公共父级,再通过 props 将 state 传递给这两个组件。这就是所谓的“状态提升”,从而达到组件间状态共享的目的。
阅读更多
React UI 中的声明式思维
React 事件响应及单组件状态处理