react学习笔记

Hooks 函数组件 与 类组件 侧重点: 类组件: 面相对象的编程思想 (对象的创建 => 继承和复用) 函数组件: 面向函数的编程思想 (函数执行) react组件是干嘛的? render(dat

第三节-事件属性demo-分页器 在React中,事件的本质就是一个函数第三节-事件属性demo-分页器 在React中,事件的本质就是一个函数

useReducer 可以看成是useState的进化版本,集成式的处理数据 示意图useReducer 可以看成是useState的进化版本,集成式的处理数据 示意图

这里我采用create-react-app进行搭建 主要是熟悉一下很久没有配置webpack了 从架构的层面本人觉得简单够用就行了 如果安装太慢了，终端设置淘宝镜像 扩展配置项 将create-rea

非受控组件 不受状态管理的组件(可以基于ref获取Dom元素进行操作); 使用方式如下 ref="xxx" 不推荐使用 ref={x => this.xxx = x} React.createRef

PureComponent 看一下下面的例子对比 这种写法不会造成视图的更新,但是render方法却执行了这就浪费性能了 正常人不会这么写的 为什么会出现这种问题尼? 继承Component，当修改的

组件的渲染机制 render 渲染的时候,如果发现type是一个 字符串: 创建元素标签 函数：把函数执行,把解析出来的props当实参传递给函数 单闭合调用: 不能书写子节点 [没有children

redux 用于统一管理项目的状态,不过也会使项目的复杂度变高,看这去用 组件 上下文对象 store 图示如下

React的简单实现 ReactDOM.render实现；React的简单实现 ReactDOM.render实现；React的简单实现 ReactDOM.render实现

redux 用于在项目中统一处理公用的状态 基础源码 组件使用 效果如下: 进一步完善版本 处理中间件的 如下图:所示

react-router-dom@6 基础最小化demo 路由模式的说明 HashRouter: hash路由 => /#/about(兼容性更好,路径丑陋点) BrowserRouter: hist

自定义hook 将常用的、跨域多个组件的Hook功能,抽离出去形成一个函数,该函数就是自定义Hook,由于其内部需要使用Hook功能,所以它本身也需要按照hook的规则实现 函数名必须以use开头 调

useEffect 用于处理函数组件中的副作用 ajax请求 计时器 更改真实的DOM 本地存储 其它会对外部产生影响的操作 类组件中使用副作用的生命周期 componentDidUpdate、com

Hook简介 hook是react16.8之后出现的 组件分为 无状态组件(函数组件) 类组件 类组件中的麻烦 this指向的问题(bind、箭头函数的形式) 繁琐的生命周期(需要理解记忆) 其它问题

redux 数据管理模型,跟React没有关系 三大原则 单一数据源(所有的数据在一个对象里面) state是只读的 使用纯函数执行和修改 最基本的redux用法 使用 store的项目处理 多个re

Context api 嵌套使用 Context.Provider 是通过 React.createContext 创建出来的一个组件 Provider组件可以插入其它组件目的 -> 订阅这个Cont

Context 给整个组件树共享全局数据的 简单城市选择器的例子 最适合的场景:杂乱无章的组件都需要同一些数据的时候,层级过多的时候 单纯为了不层层传递属性,Context 实际上是不合适(组件是要有

context方便祖先组件向后代组件传值 下面是一个换肤的例子介绍context的使用 通过React.createContext来定义一个变量 ButtonNav组件 NavItem组件 页面样式如

通俗的来说通过 ref → 来控制表单,不用状态值来控制 上传组件只能使用 非受控组件来实现 怎么去选择受控组件和非受控组件 根据场景去选择，尽量去选着受控组件,如果不行去考虑非受控

state：是唯一数据源 控制表单操作并且同步 state,这是受控组件的章节下一节非受控组件下一节非受控组件下一节非受控组件