07｜全局状态管理：如何在函数组件中使用 Redux？
荧光笔
直线
曲线- 深入了解
- 翻译
- 解释
- 总结
本文介绍了在函数组件中使用Redux的重要性和基本概念。Redux作为一款状态管理框架，通过全局状态管理提供了可预测性和易于调试的优势，使得React能够更灵活地解决问题。文章通过示例代码演示了如何创建Store、使用Action和Reducer修改Store，并利用subscribe监听Store的变化。重点强调了Redux的核心机制：State + Action => New State。此外，文章还介绍了如何在React中使用Redux处理异步逻辑，包括使用middleware和redux-thunk来实现异步Action。通过深入浅出的解释，读者可以快速了解Redux的基本概念和在函数组件中的使用方法。文章内容丰富，适合想要学习在函数组件中使用Redux的读者阅读。
《React Hooks 核心原理与实战》，新⼈⾸单¥59
全部留言(22)
- 最新
- 精选
Isaac置顶老师，redux 如何和自定义 hooks 很好的结合起来？ 比如常见的获取一个列表，我封装成一个 useList 的自定义 hook，那么就可以在多个组件中使用 useList。但是每次 useList() 的时候，都会触发接口调用，获取到的数据源组件之间无法共享。作者回复: 给你看一个实际的例子，你可能就可以理解了。关键在于，useEffect 中判断是否要去获取数据。这个判断条件可能因场景而异，比如下面的代码，只在 admins 不存在，并且没有 error 不在 pending 的情况下，才调用接口。 export function useFetchAdmins() { const dispatch = useDispatch(); const { admins, fetchAdminsPending, fetchAdminsError } = useSelector( state => ({ admins: state.pluginPluginManager.home.admins, fetchAdminsPending: state.pluginPluginManager.home.fetchAdminsPending, fetchAdminsError: state.pluginPluginManager.home.fetchAdminsError, }), shallowEqual, ); const boundAction = useCallback( (...args) => { return dispatch(fetchAdmins(...args)); }, [dispatch], ); useEffect(() => { if (!admins && !fetchAdminsPending && !fetchAdminsError) boundAction(); }, [admins, fetchAdminsPending, fetchAdminsError, boundAction]); return { admins, fetchAdmins: boundAction, fetchAdminsPending, fetchAdminsError, }; }
2021-06-0978
H请问老师在这个专栏更新完之后还有没有其他的计划》 学习老师的每一篇文章以及视频都有醍醐灌顶，任脉打通的感觉。 很期待老师接着出一个关于解读react源码的课程，很期待，很期待。 不知道老师除了react的专栏和视屏还有没有其它的课程，很想很想跟着去学习学习。作者回复: 谢谢支持，过奖了~~ 目前先把这次课程完结了哦，暂时没有后续计划
2021-06-2027
Redmi_18117543951终于知道啥是异步Action了，之前被名字吓住，学过才发现原来实际上很简单呀作者回复: 是的，很多其实挺简单的东西，需要很长的文档来说明场景和用法，造成了看上去很复杂的现象。
2021-07-201
小飞侠小结里面，最后一个词有错别字（∩▽∩），既能=>技能编辑回复: 感谢反馈，马上修正
2022-03-112
Vongolaconst data = useSelectore(state => state.data); 这里应该是useSelector吧？作者回复: 感谢指出，已提交修改。
2021-08-04
陈芳在 react-redux 的实现中，为了确保需要绑定的组件能够访问到全局唯一的 Redux Store，利用了 React 的 Conext 机制去存放 Store 的信息。 应该是Context作者回复: 谢谢指出！会更新一下。
2021-07-24
闲闲老师我有两个问题麻烦问下， 1、如果项目里面状态值特别多，业务比较复杂，感觉redux就很容易造成一些不知道哪里引起的重复渲染，导致组件频繁渲染，这个问题有啥好的办法吗？ 2、使用redux，怎么实现A请求完了再发B请求呢？作者回复: 1. 每个组件用到 redux 上哪些 state，一定要具体，不要绑定在一个太大的节点上。 2. 第9课会讲哦。
2021-06-08
腾挪给极客时间网页版提一个建议，强烈建议网页版也能像手机端一样，对写得好的文章进行点赞👍。本文写得通俗易懂，说明王老师水平很高，值得赞。2021-06-0830
L总感觉redux这套已经过时了。样板代码之类的实在是太多太繁琐了。同样是这种统一管理数据的方式，vuex就比他好很多。感觉现在很多玩的都是约定式2021-06-1224
Aaron可以通过在action添加其他字段，如payload来传递需要加减的数值2021-06-084