【React Hooks】useReducer()

useReducer 的三个参数是可选的,默认就是initialState,如果在调用的时候传递第三个参数那么他就会改变为你传递的参数,实际开发不建议这样写。会增加代码的不可读性。

使用方法:

必须将 useReducer 的第一个参数(函数)写在定义 hook 的上方。

第一个参数 state 就是你定义的数据。action 是你将来调用 dispatchData 来告诉它你要如何操作数据。

比如我要往数组中增加一个元素,我就可以这样写

switch 语句我判断 type 传递的值是不是 AddItem 如果是的话我就执行对应的方法,并且把 data 作为新加入的元素。

那么删除也是同理:

调用 dispatchData 传入 type 为 DeleteItem 最后在 switch 中判断走逻辑方法。

时小记,终有成。

相关推荐
weixin_307779136 分钟前
Jenkins Font Awesome API插件:现代化插件界面的图标引擎
开发语言·前端·自动化·jenkins
June bug14 分钟前
【Vue】从0开始使用Vue构建界面
前端·vue.js·前端框架
IT_陈寒25 分钟前
SpringBoot3.0性能优化:这5个冷门配置让我节省了40%内存占用
前端·人工智能·后端
霍理迪25 分钟前
常用块标签和三种列表
前端·html
kesteler26 分钟前
v-model的使用
前端·javascript·vue.js
Zhi.C.Yue28 分钟前
React 的桶算法详解
前端·算法·react.js
果壳~28 分钟前
【前端】【canvas】【pixi.js】水波纹滤镜实现教程 - 支持随机波动与鼠标交互
前端·javascript
han_32 分钟前
手把手教你写一个VSCode插件,从开发到发布全流程
前端·javascript·visual studio code
爱吃大芒果32 分钟前
Flutter 状态管理全家桶:Provider、Bloc、GetX 实战对比
开发语言·前端·javascript·flutter·华为·ecmascript
未知原色35 分钟前
react实现虚拟键盘支持Ant design Input和普通input Dom元素-升级篇
前端·javascript·react.js·node.js·计算机外设