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

首先要明确的是，Redux 并不是 React 独有的一个插件，它是顺应前端组件化开发潮流而诞生的一种状态管理模型，你在 Vue 或者 Angular 中也可以使用这个模型。 自身具有的状态：例如一个 Button 组件自身含有一个计数状态 count，表示自己被点击的次数。 …

为什么 React 不精确监听数据变化呢？这是因为 Vue 和 React 设计理念上的区别，Vue 使用的是可变数据，而React更强调数据的不可变。所以应该说没有好坏之分，Vue更加简单，而React构建大型应用的时候更加鲁棒。 因为一般都会用一个数据层的框架比如 Vuex…

React提供给开发者很多方法或‘钩子’，调用于一个组件的生命周期，使我们更新UI和app state。了解何时使用哪些对正确理解如何使用React至关重要。 constuctors是OOP的基础——一个无论何时一个新object被创建时被调用的特殊函数。调用一个特殊函数sup…

前端开发的一个特点是更多的会涉及用户界面，当开发规模达到一定程度时，几乎注定了其复杂度会成倍的增长。 无论是在代码的初始搭建过程中，还是之后难以避免的重构和修正bug过程中，常常会陷入逻辑难以梳理、无法掌握全局关联的境地。 而单元测试作为一种“提纲挈领、保驾护航”的基础手段，为…

constructor是ES6对类的默认方法，通过 new 命令生成对象实例时自动调用该方法。并且，该方法是类中必须有的，如果没有显示定义，则会默认添加空的constructor( )方法。当存在constructor的时候⚠️必须手动调用super方法。如果在construc…

组件是构建React应用的基本单位，组件需要具备数据获取、业务逻辑处理、以及UI呈现的能力，而这些能力是要依赖于组件不同的生命周期方法的。组件的生命周期分为3个阶段：挂载阶段、更新阶段、卸载阶段，每个阶段都包含相应的生命周期方法。因为是深入系列文章，本文不会仔细介绍每个生命周期…

本文是对开源图书React In-depth: An exploration of UI development的归纳和增强。同时也融入了自己在开发中的一些心得。 你或许会问，阅读完这篇文章之后，对工作中开发React相关的项目有帮助吗？实话实说帮助不会太大。这篇文章不会教你使…

这个布局相信大家都很熟悉吧，特别是看过阮一峰Flex 布局教程：实例篇的童鞋们，是不是倍感亲切。 没错，我们这个布局是基于flex完成的，主要思路是纵横元素的分离。 整个九宫格区域应该是一个定宽高（其实不定也无所谓）的块元素，将每一行(row)纵向排列。 每一行都是一个row，…