【React Hooks】useReducer()

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

使用方法:

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

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

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

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

那么删除也是同理:

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

时小记,终有成。

相关推荐
iCxhust5 小时前
在 emu8086 中可以直接编译运行的完整汇编程序,演示数组的定义、遍历、求和、求最大值。
开发语言·前端·javascript·汇编·单片机·嵌入式硬件·算法
JianZhen✓5 小时前
2026前端高频面试题总结(Vue/JS/网络/Webpack/性能优化/手写)
前端·javascript·vue.js
里欧跑得慢5 小时前
Flutter 主题管理:构建一致的用户界面
前端·css·flutter·web
龙猫里的小梅啊5 小时前
CSS(八)CSS显示模式display属性
前端·css·css3
雨季mo浅忆5 小时前
第二项目重新梳理
前端·面试
李白的天不白5 小时前
webpack 与 vue-loader 版本冲突问题
前端·vue.js·webpack
sunneo5 小时前
专栏D-团队与组织-05-冲突与决策
前端·人工智能·产品运营·aigc·产品经理·ai-native
空中海6 小时前
05 React Native架构设计、主线项目与专家实践
javascript·react native·react.js
舟遥遥娓飘飘6 小时前
量化投资体系之二:为 Web 看板集成公众号/财经原始数据
前端·数据分析·自动化·ai编程
ZC跨境爬虫6 小时前
跟着 MDN 学 HTML day_13:多媒体嵌入 —— 视频与音频
前端·css·笔记·ui·html·音视频