Redux 学习笔记01——Redux的简介和安装

写在前面

这篇博客记录的是我在学习Redux中的一些笔记，注意是Redux，而不是React-Redux。在你的Reac项目中，你应该权衡一下应该使用两者中的哪个，后者虽然提供了便利，可是须要掌握额外的 API，而且要遵照它的组件拆分规范。我我的仍是比较喜欢使用Redux，因此一下的笔记都是关于Redux的知识。

在这片博客中，我会从零介绍如何在React项目中使用Redux，也算是一个面向小白的入门教程，但愿能够帮助到你们。

Redux 是什么

对于前端小白来说，若是想要学习Redux，那么你颇有可能已经学了一段时间的React.js，想要在React项目中使用Redux。因而你可能产生这样一个想法：Redux是React的一个附属品，或者是Redux包含于React中。

其实否则，Redux和React之间能够说没有任何关系，这彻底就是两个框架。没有Redux，React依然能够活得好好的，能够发挥本身原有的做用，只不过在Redux的加持下，React项目会变得更加完善。

举个例子来讲，React就像是一座图书馆，Redux就像是图书馆中的管理员。没有管理员，图书馆依然能够正常工做，你能够本身图书馆找书，借书，还书。可是在寻找书的过程当中可能花费大量时间，在借书和还书的时候，须要本身在借书簿上面记录，很是不方便，并且容易出错。

可是有了管理员的帮助，你再去图书馆找书，就能够询问管理员，这本书在什么位置，而后很方便地找到这本书。在借书和还书的时候，只须要把书交给管理员，而后出示本身的借书卡，让管理员帮助咱们完成登记的工做。这样对咱们来讲，既方便有准确，开开心心的享受管理员带来的服务。

参考这个例子，我再结合实际的React项目介绍一下Redux的做用。

你在学习React的时候会被告知：React是一个 视图层 的框架，在一个基于React的项目中，它的主要做用是为你应用的每个状态设计简洁的视图，当数据改变时有效地更新并正确地渲染组件。可是React却不擅长管理数据，特别是组件之间的数据产地，好比项目中的组件结构以下：

若是这个时候组件4想和组件10进行数据传递，你须要先把数据从组件10传递给组件9，而后以此把数据传递给组件七、组件一、组件二、组件3，最终达到组件4。这中间的代码量和工做量可想而知。这还不是最糟糕的，最糟糕的是万一传递的数据出现了问题，你都不知道是哪个组件形成的，还须要一个个的去调试。

在这个状况下，咱们就须要一个方案来统一管理数据，在组件中直接引入须要的数据，而且使用统一的方式来修改数据。这个时候，Redux就排上用场了。若是咱们在项目中使用Redux管理数据，那么你将体会到什么叫作清晰明了、简介方便。

说了这么多，相信你对Redux有了一个大体清晰的认识，下面咱们就开始介绍如何具体的使用Redux吧。

Redux的安装

Redux是一个数据层的框架，想要使用Redux，须要在项目中安装，命令以下：

npm install --save redux
复制代码

安装完成以后，咱们就能够开始咱们的Redux使用之旅了。