React-Redux介绍和基础用法
目的
1、了解并知道Redux是做什么的,用它能解决什么问题。
2、知道如何引入和使用它。
在了解这篇文章之前,你已经跨过了前端知识的入门阶段,并且已经做了一些项目。项目开发过程中你遇到了以下一些情况一直困扰着你,你发现项目中维护这个数据有些混乱,而且变得预发不好扩展:
1、多个组件里面频繁的使用到相同的数据,并且这个数据改变还会造成其它组件的变化
2、在改变那个数据的时候,有时候还需要创建一些额外的数据供我自己和其它组件使用
3、有时候,我还希望那些数据恢复到某个操作之前的状态
4、特别的,还希望这些数据在网页关闭之前,可以随时使用到它。
以上一些情况,也许通过合理的代码优化会让一部分问题得到解决,但是现在有了Redux,一个灵活而轻量的库来帮我们更优雅的解决这些困扰。
当然,Redux并不适合所有项目,在了解以下内容后,我们便可以有自己的判断来是否使用它。
什么是Redux
定义
来自官方的定义:Redux 是一个使用叫做 “action” 的事件来管理和更新应用状态的模式和工具库它以集中式 Store(centralized store)的方式对整个应用中使用的状态进行集中管理,其规则确保状态只能以可预测的方式更新。
重要概念
State
这里可以把它看做是整个项目应用程序的全局数据源,一般把它设计为一个包含若干数据的对象,某些UI的变化依赖State的数据更新,因此这里如何设计State的数据结构变得尤为重要,可以总结出以下2个方面
1、全局性和多组件引用
任何数据都放到State来管理是不可取的,不仅增加数据的复杂性,
2、模块划分
Store
Action
Reducer
Redux使用
定义Store
挂载Store
定义Action
创建Reducer
触发Action
参考
1、官方文档:cn.redux.js.org/tutorials/e…
2、