42_尚硅谷_redux_counter应用_redux异步版本.avi原创

来，我们继续往下看啊。好，我们前面呢，已经把react re用上了，下面来看一下它有什么问题。嗯。这里面有一个问题，就是reduction里面默认是不能进行异步处理的，比如说老师，我们不有异步处理吗？我们来看一下我们的异步处理是怎么处理的。其实我们的异步处理是在react里面做的。就这里。我们没有生太out对吧，我是过了一秒钟以后是不是还去增加。啊，这种事情呢，按说来说，譬如说举个例子，我们是不是有可能要发请求。那这个事呢，应该是reduction里面去做，而不是在里面做。但关键是reduction里面它不支持一步操作。他不是不支持的。那怎么样才能支持了，对吧。

这个时候就要用到一个东西叫中间键，诶其实这个应该是听过了的，接触过，那中间键是什么东西啊。对吧，它其实啊中间是谁谁谁的中间件，对吧，就是说是某一个库的中间啊，譬如说我们那个，呃，就是express，其实express它本身实现功能很小，对吧，它是通过很多中间键是不是来去实现它的功能。就说白了，工件是能扩展当前这个库的功能的。一些插件。简单来说。懂不懂啊OK，我们现在呢，就涉及到，诶，你看这名字，你可应该知道这应该是谁的插件。记住了啊，看看着名字搞清楚react插件和插件是两码事。对吗？你这个插件包装的是谁？

也是扩展它的功能呗。对吧，其实这一个插件就是专门用来去让在redux里面去写义务代码的。刚才不说过了吗？Redux本身默认是不支持一步。但我又需要。对吧，所以就专门有人会写一个用上一个插件。来去，最终呢，实现异步代码的编写。啊，那也就是说我们现在要去对我们的项目呢，进行一定的改造。看一下C，把这个项目呢，给它备份一下。那这个应该写什么名字？COUNT3了吧，下划线当前是react杠。好，我们就去来去基于它来做啊，那首先第一步刚才说了，我们要去先去把这个给他什么下载一下。

它的用法很固定啊，大家适当的要去有一些记忆的事情要做好，先下载。没网啊网，嗯，没网没网没网怎么办？打电话我先试试我的手机能不能让他连上。流量没是挣，你花不了多少钱，钱不是问题，钱钱不是问题啊结问题是有钱不一定能连上。不一定能连上。关键是。这么多WiFi，是有你们的吗？是别人呢？

不是不一定。你那啥手机安卓的。嗯，IPhone现在。不上没有了。啊，对，我对象是我老婆，因为我媳妇跟我同名，其实有时候也挺别扭的，就是我都我基本上不叫他的名字，因为叫他就像叫自己，这个感觉太好了，我媳妇老婆你为什么不叫我，我说这咋叫，实在不行叫亲爱的。

啊。好有网啊有网了，等会我把它讲完搞清楚以后，我们再我再把那视频给大家放一下。说下钱不是问题啊，再说一个事啊，再说一个事，就是经常每个班我都要说一下，就是有时候有会有人跟你打那种诈骗电话，不知道为什么，就是从去年开始就每个班都有那种，嗯，不是每个班隔了几个班就有同学说老师好像有人跟我，你是不是跟我打电话了，找借钱，我再说一遍，我不会找你借钱的啊，这不知道为什么，就是晚上有人就就冒充冒充说我去找他借钱，因为已经出现好几个人了啊，应该是网上信息泄露了，或者怎么着的，也不知道是怎么回事，还好啊，一直每个班我都有数，反正啊你要再借那那不能怪我，那说明你太傻了啊，那是你钱太多，你给就给，你就做慈善事业了。

啊。来我们把这个下载以后呢，怎么应用上它呢，这个应用的办法呢，还挺麻烦的啊，相对来说比较麻烦，我们来看一下。在这个的时候啊，来说一下，因为单词里面呢，除了有这个create store，它还有一个东西看下这个。什么意思？啊，应用一个什么中间键看到了吧，应用一个中间它是个函数啊，它有函数好了。这是要做的第一件事情，第二件事情，我们要把这个re上把它引入进来，就刚才我不下了这个包吗？啊，这这个中间间的包专门用来实现异步的，好把它引入进来，下面继续往下看啊。

哎，看着我们前面调用这个create store的时候，是不是就传一个参数啊，实际上还有第二个参数可以传。就是指定我应用上哪些中间件，什么意思呢？就是这一个亏斯动，它有第二个参数。第二个参数不是传他啊，记住了，不是传他啊，也不是传他，而是传它调用的结果。这不就应用一个中间键，应用谁呢？把谁用上？把它用上。这个能不能懂啊，其实这个啊，说实话，你你就这是个模式代码，你你你自己写不出来没关系。你说以后你照着写就行。这个作用就是应用上，你看它名字翻译嘛，应用上什么异步的中间件啊，异步中间件。

好，那后面啊，我们该怎么去处理了啊，后面就涉及到一些事情，大家看呢。我们这一个。这一个这个行吧。现在我们的异步是不是在主界里面写的呀？我现在希望能够这么做，怎么做呢？看着啊，我不用使用定时器了，我希望是这样的，this.pro它有没有一个方法叫最后一个方法叫increment think。Asy nc，传他去实现。啊，我干掉。懂不懂，就是我希望我调用这个方法，它是过了一秒钟以后才真正的去增加。那也就是说这个事情是不是应该大家看到我如果能掉，我这边要做什么事。

是不是要声明？它应该是函数吧，好，再来一个。那大家想，我们这里面的函数参数从哪来的？应该是从我的这一边看啊，我不有专门的那个容器组件吗。容器组件现在是不是就传了两个函数，是不是缺一个好，缺一个引动吧，是一个，但是这一个我们说过，这里面所有的都应该是从哪里引入进来的。是不是从这个里面引入点。看到吧。懂不懂，嗯，那现在为什么波浪线啊，因为我没有啊。能明白吗？好，那也就是说这个里面我们要去定义一个什么呢，叫E不X。

啊，OKE好来怎么定义前面都是一样的这个名字，这个名字不能随便瞎写了吧？啊好，也要接受一个什么number。哎，接收一个number，写写对一点，好，接着来个箭头。我能直接就这么搞一下吗？肯定不能解，就是说我直接这么返回，你想啊，那是异步的吗？不是，那肯定跟上面的效果一样的呀，有一点它马上就增加了。是不是意思好，他的衣服是怎么做的，看着啊，是这么做的。你return的是一个函数。不是一个对象，前面的是不是都是对象，也就是说这里说的是啊，同步的X都是返回一个什么对象，而异步的action呢？啊，返回的是一个函数。

懂不懂先访问函数，等到了时间再去说啊，来看它，我先写写啊。而且啊，在一个函数里面。啊，大家看到啊，现在我直接写return还是代表是啊这样的，大家看到我这里面我先写吧，这东西有点小复杂啊，说实话有点小复杂。好，在这个里面我们去写异步的代码。这个代码我们应该怎么写，我们的异步代码是怎么写的呀？Set timeout是吧，接着了是不是现的函数，接着指定一个什么时间呗，在里面是不是就说明我要触发。

更新了呀。那么呢，此时我就可以去调用什么东西了，PA一个我分发action嘛，说白了我是不是一秒之后才去分发IP。分发action是不是才会去？更新，产生一个新的状态。能懂吗？就前面并没有产生心理状态吧，对不对，好，那我这个地方啊。是不是需要用X？我每一个异步的action最终最好为它提供一个什么呢？同步的action其实现在就是调查去，很简单啊。看看大家能不能懂，传入number是不是这意思？看到吗？也就是说我是一秒之后才去分发X增加X对不对，大家看到啊，我相当于是一秒之后才去什么啊，OK，诶，才去啊。

分发。分发一个什么X，是不是增加的X啊，增加的X。那增加action产生是不是要通过它来产生？其实说说实话，这个结构很复杂啊，说实话啊，外面是个函数对吧，里面return的什么，又是一个函数。看得懂吗？啊，里面return又是一个函数，有有一个函数的什么嵌套。对吗？有一个函数的嵌套啊，OK。那也就是说我看看的异步的action和前面的前面action是不是返回的这个对象，而我这个了返回的是个什么。函数。看到吧，返回的是一个函数。

啊，那都写一层没有啊，这个你看呢，你想想看啊，这个地方我如果不写这一层，那我直接写个对象跟上面一样的吗？啊。拿多写一块哦，我这个我这个这个哪多写一多对多写一个啊，因为因为这里面，因为这里面已经什么。啊，多写一个括号啊，因为这里面已经有了嘛，确实啊，啊OK，多写一括号。因为现在现在也就是说我如果这里面返回一个对象的话，是不是跟刚才一样，对不对。那就是一个同步的了。是不是这意思，而我现在希望返回一个什么函数嘛。对吧，如果是异味的，刚刚说过了，必须反过来是个什么函数，而在函数里面就可以执行什么。

意义，不代码。能看懂，在函数中才能执行异步代码。那最终当我真正要干活的时候，我还是要去干嘛去，是不是分发一个同步的action。有同步X和1X什么意思？同步X1分发是不是马上就会产生效果？但是我这个是不是在一秒之后才执行。能看到吧，OK。好，当然你可以，这个大括号其实也可以省略，怎么省大略？把去掉都可以，这个该怎么怎么做，对小括号对很好啊，就写个小括号。自己在北面生了。看到吧，啊OK，但这么写法，其实我其实平常更多的写法是这么写，因为这个结构比较复杂，所以我特别强调一个，这个我就有意的写出来。

等着吧，啊，OK。好，但是你要想这么写啊，记住你要想这么写，你要想一个函数，你必须啊，必须在这个这个你index里面。哎，不是我没有写在index里面，我写的是store里面的是吧？啊，这个store里面去用上这个什么中间键才支持这种写法，也就是说默认它只能怎么写呢。只能这么写，就一个什么。对象，那我下面的是吗？不是我是个什么函数。说白了，这个函数靠谁来调啊？是不是call那个异步中间件呢。对不对，他来帮你去做一些事情，说白了他跟你做了扩充，你本来不是直是对象吗？那支持对象，那你没办法义务。懂不懂，那现在你又希望有一，那我先给你啊，让你能够支持函数。

函数有个特点，它开始没执行之前有效果吗？没执行之前，你就说我这个函数没有执行之前，这个消息分发出去没有action分发没有没有吧。对不对，那等到时间到了之后，他才干嘛去。是不是真正的去分发一个同步的IP。能不能看到啊，这个结构稍微有点复杂，但其实说实话，写多了，它是个套路。就老师在你只要是100险，你就写这样一个结果出来。把它名称改改。就可以了。开始的时候稍微有点小费劲，好了，来，我们来看一看，看看我们当前的这个可不可以改的地方并不算特别多吧。啊，主要改了几个位置，第一个我用上了中间键对吧，一步中间键，再一个我的这一个组件里面。

是不是直接去调用这个异步的函数去更新呢？对吧。啊，我就没有一部贷款了吧。我自己有些优待吗？没有，因为业务代码移到哪去了。移到我们的X里面去了。啊，三个位置啊，就改了三个地方，现在我们就来看一下，看看我们的这个最终的结果，看看行不行，M PM start。嗯。现在啊，如果我们这个set time可以，那我要是发个价成就可不可以。是不是一样可以啊啊，因为他们做的做法是一样的，都是一个异步的操作。好，来看一下方案。行不行啊，这样可以是吧，主要其实这个投入对不对对吧，别的都没有什么，没有变化，所以没什么意思，我们主要搞它。

可不可以，是不是可以啊，七秒以后它是不是就变化了啊，就这么意思。啊，这一个这种e action在实际项目开发中是必用。因为你想嘛，我们去做一个react的项目啊，肯定会有从后台获取请求获取数据啊。对吧，那必然就涉及到法请求。啊，这是这一个啊，难度并不大，就涉及到两个点三个点啊，把这三个点用上就行啊。好，这是这一个。