Redux 和 Vuex 的区别
vuex 和 redux 都是状态管理库,用于单独管理状态的。其中,redux是一个范用的库,可以单独使用。而vuex是专门用来配合vue使用的。他们都应用了flux架构的思想,但是在接口的提供上稍有不同。
1. 核心概念对比
Redux 的核心概念
action (同步action ,或借助 中间件 实现异步操作,action 不会改变 store,只是描述了怎么改变store)| mutation(用于同步操作) 、action(可用于异步操作,提交 mutation)
reducer(纯函数,根据 action 和旧的 store 计算出新的 store)
store(单一数据源)
Vuex 的核心概念
mutation(用于同步操作) 、action(可用于异步操作,提交 mutation)
mutation里面直接修改 state
state(单一数据源)
2. 使用原则:
Redux 的三大原则:
(1)单一数据源(一个Redux应用只有一个store),也是单向的数据流
(2)state只读(唯一改变 state 的方法就是触发 action,action 是一个用于描述已发生事件的普通对象)
(3)使用纯函数(reducer)来修改state。
redux的流程:
view——>action——>store——>reducer(返回)——>store——view
Vuex 的三大原则:
(1) 应用层级的状态应该集中到单个 store 对象中。
(2) 提交 mutation 是更改状态的唯一方法,并且这个过程是同步的。
(3)异步逻辑都应该封装到 action 里面。
vue的流程:
vueComponent——>(dispatch)action——>(commit)——>mutations——>(mutate)state——>(render)vueComponent
3. 处理异步操作
Redux 的中间件机制,利用 redux-thunk ,redux-thunk可以dispatch函数,这个函数用于生成action,所以在这个函数里我们可以进行异步操作,等异步的结果出来后再放在action里面,将这个action用dispatch分发出去,而这个函数被叫做 “action creator”,可以将异步逻辑放在 action creator 里面,给 action creator 传入 dispatch 作为参数,于是就可以 dispatch action,Redux 并没有创造单独的概念出来专门用于异步逻辑,它是利用了 Redux 自己实现的中间件机制,中间件从 dispatch 一个异步 action 到 action 到达 reducer 之间处理 action,在这期间通过异步操作得到的结果可以放到 action 里面再通过 dispatch 分发到 reducer,以前 dispatch 一个 action 之后,这个 action 回立即到达 reducer ,所以是同步 action,现在在 action creator 里面,可以等待异步操作结果再生成 action 分发,所以叫做异步 action
而 Vuex 是用 mutation 来对应 Redux 的 action,另外 Vuex 又创造了一个 action 来提交 mutation 并通过异步提交 mutation 来实现异步操作结果能够修改 state.
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 智能桌面机器人:用.NET IoT库控制舵机并多方法播放表情
· Linux glibc自带哈希表的用例及性能测试
· 深入理解 Mybatis 分库分表执行原理
· 如何打造一个高并发系统?
· .NET Core GC压缩(compact_phase)底层原理浅谈
· 新年开篇:在本地部署DeepSeek大模型实现联网增强的AI应用
· DeepSeek火爆全网,官网宕机?本地部署一个随便玩「LLM探索」
· Janus Pro:DeepSeek 开源革新,多模态 AI 的未来
· 互联网不景气了那就玩玩嵌入式吧,用纯.NET开发并制作一个智能桌面机器人(三):用.NET IoT库
· 上周热点回顾(1.20-1.26)