Redux概念简述

react可以写出一些比较简单的一些项目，但是只能写出很简单的一些项目，原因是什么呢，原因是react是一个非常轻量级的是视图层框架，打开官网可以看到大大的一行字，A JavaScript library for building user interfaces，一个js库，干什么用的呢，创建UI接口的。也就是他是一个非常简单的视图层的框架。为什么这么说呢，如果我的组件非常的多，经常要在组件之间共享一些数据，进行传值。用react编写应用会发现这个应用会变得非常的恶心。所以说react知识轻量级的视图层框架。

目前全球范围内，比较好的react搭配的数据层框架是什么呢，就是redux。首先redux是一个什么东西。

 

如图，在没有redux，只有react的时候，组件之间的传值会非常的麻烦，假设引入了redux。组件的传值为什么就简单了呢，看右侧的这张图。假设绿色的组件要给很多个灰色的组件传值，怎么去传呢。如果用redux。很简单，redux里面要求把数据都放在一个公共的存储区域，叫做store。组件之中尽量少放数据。也就是所有组件的数据都不放在组件自身了，我们都把他放到哪里去呢？放在一个公用的存储空间里面，叫做store这里

当绿色组件想要改变数据传递给其它组件的时候怎么办？我只要在绿色组件改变对应的数据就行了。接着灰色区域的这些组件会自动的感知到有变化了。只要store里面数据有变化，灰色组件会自动去store里面重新取数据。这样绿色组件的数据就非常轻松的传递给其它组件中。

redux就是把我们组件之中的数据放在公用的存储区域去存储，然后组件改变数据就不需要传递了。改变store里面的数据之后，其它的组件会感知到我store里面的数据发生改变。他再去取就会取到你要的数据。这样，不管层次结构有多深，走的流程都是一样的。所以会把数据的传递简化很多。这就是redux基础的设计理念。

接着，其实 Redux = Reducer + Flux。这又是什么冬冬，react在2013年开源的时候，facebook的团队除了放出react这个框架之外，他还放出了一个框架，叫做flux。flux这个框架实际上就是官方推出的最原始的辅助react使用的数据层框架。当然在他推出之后，业界的人在使用之后发现flux实际上有一些缺点。比如说他的公共存储区域store这个部分可以有很多个store所组成。这样的话，数据存储的时候，就可能存在一个数据依赖的问题。总之他不是特别的好用，于是有人，就把flux做了一个升级，升级成了我们目前使用的redux。在redux里面除了借鉴flux以前很多的设计理念之外呢，他又引入了一个reducer的概念。因为flux这个框架实际上目前已经有些过时了。所以就没必要去在意他的一些细节点了。