React 采用将事件挂载至 document 或者 window 上来实现顶级事件。接下来我们会一一来介绍事件的实现过程。 我们来回忆下， ReactNativeComponent.js 中 _createOpenTagMarkup 方法中的 putListener 函数和 …

那么关于生命周期， React 当中生命周期有 2 个。 一个是组件的生命周期 _lifeCycleState ，另一个是复合生命周期 _compositeLifeCycleState 用于复合组件。 那么到此，实现生命周期功能。那么让我们来看看那些生命周期的钩子都在哪里：

在某一时间节点调用 React 的 render() 方法，会创建一棵由 React 元素组成的树。在下一次 state 或 props 更新时，相同的 render() 方法会返回一棵不同的树。React 需要基于这两棵树之间的差别来判断如何有效率的更新 UI 以保证当前 U…

历时近 6 年之久，从 0.3.0 (May 29, 2013) 至 16.8.6 (March 27, 2019) 整个 React 框架已经经历了可以说是“脱胎换骨”，具体更新内容细节可以移步至 CHANGELOG.md 查看。 回看 v0.3 ，源码存放在 src 目录下…

JSXTransformer.js 会将 type="text/jsx" 的形式转换成 React.DOM.h1 的函数形式。 objMapKeyVal 是个工厂函数，他最终会返回一个“键”与 obj 对应的对象“值”则是 func 的执行结果。 ReactDOM 对象中的“键…

下面我们依次来解读 CSS 样式 和 DOM 属性。 这里需要注意， mergeInto 函数会对 one , two 参数进行校验。 校验他们是否为 object ，并且不是 array 。 校验下 props.style 传入的是否是对象，然后创建 CSS markup 标…

这里的内容，我相信大家看的都很眼熟吧，这和 ReactDOM.js 中的 Constructor 一样，只不过这里不接受 children 参数，而是只接受一个 text 参数。 那么在压扁之后，我们调用的是 ReactMultiChild.Mixin.mountMultiCh…

在这里，我们看到创建组件的方法是 React.createClass ，组件就是一堆 HTML 元素的集合，但是组件具有状态 (state) 和属性 (props) ，还具有生命周期，并且组件可以更新。所以我们会一一将其到来，那么本次我们仅讨论组件渲染。我们看到复合组件 看到 …

即便你的组件以 function 的方式声明，在 React 中你也并不会直接调用他们。每个组件返回一个该渲染什么的描述，该描述会包含开发者写的组件如 <LikeButton> 和 平台特定的组件如 <div>。由 React 决定在未来的某个时间点展开 <LikeButton…