useState的更新写法某些情况下过于繁琐，新文档介绍的use-inner虽然可以稍微补足，但是还不够丝滑，本文将介绍一种类似Vue的reactive的写法，写起来十分丝滑，也更符合编程直觉。

在介绍 Refs 之前，我们先来了解两个概念：受控组件 和 不受控组件。 在HTML中，表单元素（如 input、textarea、select）之类的表单元素通常可以自己维护state，并根据用户的输入进行更新。而在React中，可变状态（mutable state）通常保存…

通过es6新增class的属性创建的组件此组件创建简单. React 16.3版本后，使用此方法来创建ref。将其赋值给一个变量，通过ref挂载在dom节点或组件上，该ref的current属性,将能拿到dom节点或组件的实例 子组件通过React.forwardRef来创建，…

大家都说简历没项目写，我就帮大家找了一个项目，还附赠【搭建教程】。 本轮子是通过 React + TypeScript + Webpack 搭建的，至于环境的搭建这边就不在细说了，自己动手谷歌吧。当然可以参考我的源码。 这里我也是通过别人学的，主要做些总结及说明造各个轮子的一种…

现在(2018年)react在前端开发领域已经越来越🔥了，我自己也经常在项目中使用react，但是却总是好奇react的底层实现原理，多次尝试阅读react源代码都无法读下去，确实太难了。前不久在网上看到几篇介绍如何自己动手实现react的文章，这里基于这些资料，并加入一些自…

本文将会通过一个简单的例子，结合React源码（v 16.4.2）来说明 React 是如何工作的，并且帮助读者理解 ReactElement、Fiber 之间的关系，以及 Fiber 在各个流程的作用。看完这篇文章有助于帮助你更加容易地读懂 React 源码。初期计划有以下几…

基于 redux、redux-saga 和 react-router 的轻量级前端框架。 当此类行为会改变数据的时候可以通过 dispatch 发起一个 action，如果是同步行为会直接通过 Reducers 改变 State ，如果是异步行为（副作用）会先触发 Effect…

啥也不说，先来看看用我们85行的React.js直接替换别人写好的扫雷项目中的React.js，看看效果怎么样？哈哈，是不是正常运行了。 Attention：一定不要被下面辣么多的代码吓到，因为下面辣么多的代码只是每次在上一个commit的基础上添加几行而已，大部分都是重复，只…

上次我们看完了自定义组件渲染的表层逻辑。这个过程虽然看似很像简单组件对应的逻辑，但也包含一些其特有的处理：1）一个额外的ReactCompositeComponent 需要被实例化来代表这个自定义的组件（App）；2）App.render()会触发很多个React.create…