阅读 34

react hooks学习笔记

useState

1, 靠顺序记忆

2, 不能存在于条件判断语句中

useEffect

1, useEffect里面是一个匿名方法,useEffect是异步的,有一个延时的动作,

2,useEffect 对应类组件中的componetDidMount, 和componentDidUpdate 这两个生命周期函数

3, useEffect第二个参数

  (1) 如果第二个参数为空,只有组件销毁的时候,才会执行解绑函数,如果没有第二个 参数,会一直执行解绑
  函数 useEffect里面的匿名方法中,return 是匿名解绑函数,
复制代码

4, 当useEffect第二参数不为空的时候,

useContext

1, 解决父子组件传值, 父组件创建上文对象, 比如:CountContext = createContext()

2, 子组件使用useContext 接受,useContext(CountContext) , 是哪个上下文传递的值,就把哪个值放入useContext中

useReducer

1, useReducer 有两个参数,第一参数是reducer函数, 第二个参数是当前操作的这个state的初始

2, 第一参数reducer函数,里面也有两个值,第一个是state, 第二个是action,

3, 整个useReducer返回两个参数,第一个是count的值,第二个是dispatch派发器,传递一个action进去

useReducer, useContext 实现Redux

useMemo 解决性能问题

shouldCompentUpdate, 组件更新之前
如果父组件更新了,子组件也会跟着一起更新,这个时候就有性能问题
useMemo有两个参数,第一个参数一个匿名方法,第二个参数是控制匿名方法执行的变量,如果参数有改变,就不执行
复制代码

useRef

1, 获取DOM元素

2, 保存变量

自定义函数

1, 必须use开头

2, useCallback 缓存我们的方法, useMemo缓存我们的状态

文章分类
前端
文章标签