Redux基础知识
redux是什么
1. 介绍
- redux是一个专门用于做状态管理的JS库(不是react插件库)。
- 它可以用在react, angular, vue等项目中, 但基本与react配合使用。
- 作用: 集中式管理react应用中多个组件共享的状态。
2.什么情况下需要使用redux
- 某个组件的状态,需要让其他组件可以随时拿到(共享)。
- 一个组件需要改变另一个组件的状态(通信)。
- 总体原则:能不用就不用, 如果不用比较吃力才考虑使用。
核心概念
Store:Store 是 Redux 应用的核心,它包含了应用的整个状态树。可以把它想象成一个保存应用所有状态数据的 “容器”,并且整个应用只有一个 Store。
State:State 表示应用在某一时刻的状态。它是一个普通的 JavaScript 对象,包含了各种数据,如用户信息、UI 状态、异步操作的加载状态等。
Action:Action 是描述发生了什么事情的对象。它是 Store 数据的唯一来源,必须包含一个type属性来表示动作的类型,还可以包含其他数据,用于传递与该动作相关的信息。
Reducer:Reducer 是一个纯函数,它接收当前的state和一个action,根据action的type来决定如何更新state,并返回新的state。它是 Redux 中更新状态的唯一方式,并且不能有任何副作用。
基本工作流程
发起 Action:用户在应用中进行操作,如点击按钮、输入文本等,这些操作会触发相应的action。
Store 接收 Action:Store接收到action后,会将其传递给reducer。
Reducer 更新 State:reducer根据action的type对当前state进行更新,并返回新的state。
Store 更新状态:Store使用reducer返回的新state替换旧state。
视图更新:Store状态发生变化后,会通知相关的视图组件,视图组件根据新的状态重新渲染,以反映出应用状态的变化。