weixin_50828895的博客

图片上传

host 了解

发布订阅模式

虚拟DOM 和 Diff 算法问题：我们知道state 更新组件的时候，只要state 变化就重新渲染视图，如果组件中只有一个DOM 元素需要更新时，也需要将整个组件内容重新渲染到页面中吗？回答：不是，虚拟DOM 和 Diff 算法可以达到部分更新虚拟DOM： 本质上是个 js 对象，用来描述页面UI （React 元素就是虚拟DOM）执行过程React组件配合 state 创建一个虚拟DOM树根据虚拟DOM树，生成一个真正的 DOM 树，再渲染到页面中当 state 或者 pro

token

一、redux 是什么Redux 是一个专门用于做 状态管理 的JS 库(不是react 库)它可以用在react、angular 、vue 等项目中，但基本与react 配合使用作用：集中式管理react 应用中多个组件共享的状态二、什么情况下需要使用redux某个组件的状态需要让其他组件可以随时拿到（共享）一个组件需要改变另一个组件的状态（通信）...

路由的基本使用和执行过程1、路由介绍2、基本使用3、路由组件4、执行过程5、编程式导航6、默认路由7、匹配模式7.1 模糊匹配7.2 精确匹配1、路由介绍现代前端应用都是 SPA （Single Page Application 单页应用程序）, 就是只有一个html页面的应用程序。 为了有效使用单个页面管理原来的多页面功能，前端路由就产生了前端路由的功能： 让用户从一个页面导航到另一个页面前端路由是一套 ur l路径 与 组件 的对应关系使用React 路由就是配置路径和组件2、基本使用

组件性能优化方式、虚拟DOM和diff算法一、组件更新数据二、组件性能优化1、减轻 state2、避免不必要的渲染2.1 利用state阻止不必要的更新2.2 利用 props 阻止不必要的更新3、纯组件三、虚拟DOM 和 Diff 算法一、组件更新数据三种组件更新的情况：setState() 是异步更新数据结构注意：使用setState() 方法时，后面的setState() 不要依赖于前面的setState()可以多次调用setState() ，但只会触发一次重新渲染this.stat

核心思路： 通过鼠标移动事件，获取实时鼠标位置信息，再将位置信息更新在页面上鼠标位置实现思路：要设置 state，用来保存鼠标的 横纵坐标要注册mousemove事件，实时获取鼠标当前的位置，并保存到state中mousemove事件要注册给window （在 componentDidMount 方法中进行注册）将 state 的值设置 页面要显示鼠标位置的地方...

组件的生命周期一、生命周期概述二、生命周期的三个阶段1、创建阶段2、更新阶段3、卸载阶段一、生命周期概述生命周期： 组件从创建到加载运行再到不用卸载的整个过程就是生命周期 （创建 --> 加载运行 --> 卸载）掌握组件生命周期有助于我们理解组件的运行方式，完成更复杂的功能，分析组件错位u原因以及解决错误生命周期的每个阶段中都有一些方法调用，这些方法就是生命周期的钩子函数，钩子函数能够实现更多的功能只有类组件才有生命周期二、生命周期的三个阶段1、创建阶段执行时机：只要页面一经

一、组件通讯介绍组件是独立封闭的单元通常一个完整的页面是由多个组件组合而成的为了实现组件之间共享一些数据的功能，所以就需要组件之间能够通讯，这个过程就是组件通讯二、组件的props1、props的作用 ：用于接收外界向组件中传递的数据传递数据：渲染组件时，在组件标签中使用自定义属性向组件内部传递数据接收数据：组件内部可以使用 props 来接收自定义属性传递的数据函数组件通过 参数props 接收数据类组件通过 this.props 接收数据2、props的特点：除了字符串之

一、受控组件1、什么是受控组件受控组件通常指的是表单，因为HTML中的表单是可输入的，也就是有自己的可变状态React中可变状态通常保存在state 中，并且只能通过setState()方法来修改React 将 state与表单的 value值绑定到一起，给表单元素绑定change事件，将表单元素的值设置为state的值，接收表单值变化2、核心步骤第一步：在state中设置数据 state = { txt:'' }第二步：表单域中将 state中的数据与value绑定 &

state与this指向一、有状态组件和无状态组件1、概念2、state的基本使用2.1 在构造函数中定义 state2.2 在类中直接定义state2.3 获取状态：this.state3.使用setState()方法修改数据二、this 的指向1、this 的指向2、利用箭头函数解决this指向问题3、利用bind()方法解决this指向问题4、利用class实例方法总结一、有状态组件和无状态组件1、概念函数组件叫做无状态组件；类组件叫做有状态组件状态 （state），组件中使用的数据都保存在

React组件一、React 组件基本介绍二、创建组件2.1 使用函数创建组件2.2 使用类创建组件2.3 抽离组件三、React事件处理3.1 事件绑定3.1.1 通过类组件绑定事件3.1.2 通过函数组件绑定事件3.2 事件对象一、React 组件基本介绍组件是React中最重要的技术，使用React 就是在用组件组件表示页面中的部分功能通常一个完整的页面功能是由多个组件组合而成的特点：可复用、独立、可组合二、创建组件2.1 使用函数创建组件使用JS函数（或箭头函数）创建的组件叫做

一、React 概述1、概述React 是一个用于构建用户界面的JavaScript 库React 主要用来写HTML页面，或构建web应用。基于JSX的语法，JSX是React的核心组成部分，它使用xml标记的方式去直接声明界面，和html、js混写。React核心是组件，组件的设计提高了代码的复用率，降低了测试的难度和代码复杂度。组件将数据和逻辑进行封装。2、React 的特点声明式（只需要描述UL（html）看起来是什么样，就跟写HTML一样）基于组件（组件是React 最重要的内容