00:01
接下来呢,我们来完成购物车的全选。首先这个按钮它有两个状态,第一个它到底打勾还是不打勾,这是一个问题,它到底打不打勾,应该是要看下面的数据的一个情况,下面数据如果都是打勾的,它才要打勾对吧,这是个,然后呢,第二个就是点击它的时候,下面的都要和上面的值是统一的一个值。所以说我们接下来要做这个事啊,首先它到底打不打勾,就看下面的这个这个值的情况,我们下面来操作啊。好,这里呢,因为它是一个便利生产的数据啊,所以说它这个本来是可以用计算属性,但是因为便利生产就不太好做啊,那么应该怎么办呢。我们找到这个这个这个这个图片就在这啊,那么我们就定一个方法去做。定义方法啊,这个方法叫计算是否选中对吧,我们叫computer。计算这个C来。
01:03
课题的得这值,那么你传一个我要计算的数据,那么我们接下来去计算。你传给我什么呢?传给我这个负的例子列表,我给你去计算出它的到底是否要选中的一个情况啊。啊,只有是这样的,只有他们都选中,我才要选中,只要有一个没选中,它就不选中,所以这里我们可以用数字的一个方法叫every,啊,我们来判断它的这个for的。Food is set。只有以的多为处,它才为处,如果有一个为false,就不就就为false啊,所以说我们进行判断,它到底是处还是这个false。到底是选中还是不是都选中?OK,然后呢,我们就根据这个值的一个情况来去操作啊,来给这个图片加一个表达式。然后呢,在这里我们就可以计算了。
02:01
这里因为是方法,方法要加个this调用方法,然后调用方法的时候呢,传单前的这个cut.for的意思。它就会返回一个true和false,如果true代表要全选,那什么都不用加,如果为false的话就代表不全选,我们要加一个not。所以通过这个方法呢,来计算它到底是否要群选,我们一起来看啊。所以呢,现在因为我们这里没有全选,所以它不全选对的,当一旦下面我们全部选中了,我再点一下,诶,它就应该全选,诶这是正确的啊。所以第一功能就完成了,它到底选中还是不选中,我们通过一个方法去计算。接下来第二个问题就是它可以点啊,点击的时候我们要进行全选,全部选。好,那么这个时候呢,我们要更新的就是要传所有的这个cast list列表啊,我的我们传这个cast。
03:04
我们传这个car的负的意思啊,负的。传cut的复字意思就好了,同时我们到底要选中还是不选中,我们还要传它到底选中还是不选中的值,那么这里呢,我们有这个计算结果了啊,调这个方法就可以得到这个计算结果,那我们待会在这里面计算就好了,来我们来操作。来我们在这里呢,要计算这个权限,全部选一样的,我们来去看一下这个代码,看一下我们的这个函数啊。下面呢,有个更新all cut selected,它接受两个参数,一个是cut cut list里面发ID,但我们要更新的cut ID,第二个是它到底要选中是不选中的一个值is select selected。
04:01
两个参数啊,Cut list和。来,我们准备这个参数。它需要两个参数,看的意思是个数组,数组里面发ID,还有一个。好,到底选中不选中,我们要通过调这个方法去计算。啊计算,然后呢,计算出来结果是处我就要变false,计算出来是false我就变为true,所以我们计算结果之后要取个法。第二个呢,是这个卡A的值呢,我们是要去是要去处理的,我们到底什么东西要改呢?那么就是要把这个for this进行map啊,我们只要负的ID。啊,只要food的ID啊。就可以了,我们只需要它的负的class ID即可,我们用这个来发请求。卡丽里面要求数据结构是数组,数组里面放ID啊。
05:02
所以我们用map方法就可以生成这个ID了,而且是class ID,注意。好,下面这个呢,到底选不选中,就是看他之前是什么,那我取个反就好了。OK,然后呢,那么接下来操作其实跟之前这个更新旋转状态基本是一致的啊。只是他们这个请求接口地址呢,我们要改一下,改成这个接口地址。然后呢,凡是POS data是这个data好没问题,就这个啊,然后呢,这是更新服务端数据,客户端数据这里也要更新,那么我们还要对list进行。我们先计算到这个C体的这个值啊。计算好之后呢,我们对它进行for遍历。
06:05
我们更新客户端的值啊,那么就是负的CE,就等于这个CE,这里是更新客户端的值,下面是发请求更新服务器的值,下面我们一起来看效果。那首先正常的点击下面是没问题的,那么点上面。点击的话呢,它应该全选啊,诶这时候有个问题有个报错,我们看一下是不是哪里有问题。Is selected这个单词写错了,OK?好了啊,我们再看。点上面全选。呃,他没有出来啊,是不是我这个计算有问题呢。呃,计算是false,那我们就要更新为true。对吧,我们就要把负的这个值。For each编辑出来的这个负的呢,更新为处,我们来看一下传的参数是不对的啊。
07:02
它的参数是当前cut的负的意思没错啊,更新or cut?OK,那么这里就有负利列表,负里面呢,它就会对这个值进行。运算,然后呢,发请求去更新。我们来看一下服务器这一块有没有更新成功啊刷新。服务器已经更新成功了,但是客户端没有更新成功,那么也就是说我们这个操作的话呢,Is的它没有更新成功啊,没有更新成功的话呢,很有可能啊,就是我们来看一下。It's。就是。啊,不是这个啊,是上面这个。上面这个image,那么它这里没有更新成功,那么我们来看看啊,看看到底这个效果上是怎么回事,我们更新food的这个is的值,值为这个is啊,这里我们少加了个C啊,好吧,还是一样,这个单词这里写错了诶。
08:10
就说我们点全部选没问题,全选。全部选全选没问题啊。好了,所以上面这个全选全部选就完成了啊,这个单词写错了,稍微注意一下。除此之外呢,下面这个点击全选也要去完成这个功能啊,下面这个全选就会更加复杂一些。下面的学习呢,我们再添加一个商家数据,这样的话呢,我们好进行比较啊往下走。放到最下面去啊,最下面有各种食品,我们随便点击一个啊。添加一个食品。OK,添加一个之后我们回到购物车去啊。好了。呃,购物车列表这里呢,它应该要重新请求这个数据啊,那么要重新请求的话呢,这里我们可能要调为installed这个方法,他才会在每次进来的时候呢,去重新发请求,诶你看咱们的这个第二个点的数据就来了。
09:08
好,第二列数据来的话呢,那么我们在计算这个数量的时候也没问题啊,我们去掉一个去掉一个。OK,这个数量计算也没问题啊,那么我们计算下面这个全选啊,他就要去根据上面的全部选中了,它下面这个才能全选,所以它这个计算呢,稍微的费劲一些啊。来我们来计算这个下面这个群选,那么下面这个群选只有一个,所以说它可以定一个。一个按钮。第一个计算属性。好,整个计算属性,这个计算就会稍微的费劲一些,看的意思。他需要怎样呢?他需要这里面的所有数据都要选中啊。所有数据都要选中,所以说我们也可以来个压力。
10:02
然后里面要返回什么呢?要返回cut的。点服的绿色,它里面的也要都要选中,所以也来个every。双重。那我们要看什么呢?要看负的is select的值都选中才能选中啊,一个没有选中就不选中,所以这才是全选的这个图标,它应该代表的含义。好,这个为处,那么就空为false,就叫和not。好了,我们看看是不是。以上呢,没有选中,它不是全选,OK,我们点击点击啊,一旦全选它才会全选。有一个没选中,他就不取血,这是对的。接下来呢,给他绑定点击事件。啊,点击事件里面呢,我们要去更新所有的权限啊。
11:00
那这个时候呢,我们就要再去定一个方法。之前是叫OB all cuts。这个加更合适。那么上面这个呢,就叫update。某个shop的看法。它是更新一个点啊。那么我们接下来更新所有店。喂,呃,参数呢,就不需要传了啊,我们这里就是要把所有的卡进行。放在一起就好了,把所有的卡放一起啊,那么这里我们需要通过进行make。把它。或者说reduce来加也行。Reduce加我们呢?把它数组拼成一个全部的数组。
12:02
什么呢一点。Con。啊,联合什么呢?C点负的。把所有的数据进行累加,累加之后呢,我们再map啊再map,因为我只需要。这个。Food点卡卡特的ID。啊,那么第一个六次方法。来,我们把它换个行啊。第一个reduce方法的目的是为了得到所有的负的list列表。然表第二个map方法呢,就是为了for list中我提取我只要这个ID即可,别的我不需要。对吧,两个方法,当然了,你也可以说在这个拼串的时候,在把这个map方法呢,在这里面调用,那么里面就已经把它变成了这个ID了啊,这个都可以啊,你可以看你自己想做什么,那么这个就是我们要更新的这个卡。List列表。
13:01
好了。然后呢,我们接下来就是跟上面这个请求其实是一样的啊,那么我们第这个方法就好了。呃,调查方法还不行啊,还是得自己写,因为这个参数部分我们需要自己去调整。来看C。看V参数部分呢,这个差意思倒是没问题,我们计算出来了,好,这个以的值呢,应该要看咱们的这个加的二的一个取反值。是c all的续放值,这样才能完成我们的所有的全选和全部选。好,我们下面来看看效果啊。点击全选。他应该要全部选中啊,但是这里没有效果,我们来看一下是不是哪里又存在一些问题。
14:04
我们来确保代码更新了。我再点击全部选,其实请求倒是成功了,但是啊,我们没有更新客户端数据啊,我们每个客端数据,所以说在这里呢,我们在。便利的同时,我们其实可以对所有数据进行修改,没有更新数据啊,这里只是更新服务端数据啊,没有更新客户端数据啊,那么我们要更新客户端数据的话,我们想想啊。我们能不能在一个病例中做啊,如果不在一个病例中做的话呢,那么感觉会。费劲一些。我们在一个遍地中做吧,这样的话呢,我们可以定义一个卡list列表。啊,然后呢,这里面再去遍地。
15:05
好,那么这里之后呢,我们在这里看的意思就是要push。对吧,不是为了发起求得到咱们的负的点卡ID。好这一块呢,就不需要了,那么push进去之后呢,我们还需要更新啊。这个负的点。Is,它的值呢,应该要等于这个值。等于这个值,所以说在这里呢,我计发请求更新这个服务器数据,同时在这里又更新了客户端数据。好了,那么这样的应该就OK了,点先选OK,前面选先选。行不行?呃,我们来看看啊,这个值的计算呢,不应该计算,应该拿到这个值的缓存值,不然的话呢,他每次计算结果是有问题的。
16:04
我们第一次拿到这个房子,值直接赋值即可。不能让他一直计算啊,因为他一旦计算了之后,后面的值就不准确了,它这个计算属性下次又会重新取值,全部选全选。选不选全选OK那就没问题了啊。好了啊,这样呢,我们就可以达到我们整个全血全部血的功能。
我来说两句