00:00
大家好,这节课呢,我们来继续完成所有的功能,那就剩下什么呢?剩下的这个筛选对吧?成为一个筛选,那我们点击不同的这个选项是可以触发一个事件,拿到不同的一个索引啊,那索引是从零开始,01234,那我们这个筛选呢,实际上也就是传不同的请求参数而已,你看传这个sales就是按销量排序对吧?传这个就是按这个推荐排序,传这个new就是按这个这些商品排序,注意他们的值都是一,就我们传这个参数,当它的值是一啊,它就会按这个排序,那其他的就不用传,所以呢,呃,很简单啊,思路很简单,那当我们点击这个的时候,我们在这个里面,哎,点击的这个事件里面。找一下我们的点击事件啊,在这做一个判断对吧,做一个判断啊,判断筛选条件,好,那根据我们的点击的索引的不同,我们来判断这个筛选条件,同时把这个筛选条件给传给他就可以了,是不是这样的?啊,我们先把这个我们的思路想清楚啊,那哎,当然那个我们因为是这里面进行的操作,要在这里面去使用,对吧?所以呢,诶,我们肯定得借助一个中间人来存储我们的一个选择筛选条件,对不对,那我们可以借助于谁借助于啊这个啊实际上这个所以呢,啊就是。
01:11
我们点的这个就是这里面存的啊,当前点的这个索引,那我们根据它去做这个判断也可以对吧?好呃,那其实呢,我们不用在这判断,也就是说当我们点击完成之后,这个我们存到索引它会发生变化,也就说诶从0123啊,就是我们点到哪个是哪个,那么我们只需要在哪呢?在这里面去追加不同的参数就可以了,诶根据我们当前的current salt的不同啊,去追加不同的参数来给大家写一下代码,当然这里面呢,其实我们在点的时候只需要去重新请求数据就可以了啊,比如说this.get重新请求数据。再给大家捋下思路,那整体的一个思路是什么呢?就是当我们点击啊上面的导航去切换的时候,那我们改变了啊,这个this kind,同时去重新请求数据,那么这里就是在请求数据之前,实际上这个current sort,就是我们当前的这个记录的这个数据已经发生改变,所以呢,我们完全可以在请求之前通过一些判断,哎,比如说if this似点啊current sal诶等等于一,那我们就啊传一个就是嘛,我们传一个这个啊,Sales啊,就是按照销量去排序,对吧,让它的值等于一就可以了,是吧?同样的接着去写这个if就可以了,是不是这样的啊,那这是一种方式,我们先看行不行啊,当然还有一种可以优化的方式啊,比如说它等等于啊二的时候零我们不用处理吗。
02:27
啊,零的话呢,呃,实际上。哎,就不用处理就可以了,不用处理就可以了,好,那等于二的时候是谁呢?我们来看一下。二的时候是这个推荐啊推荐啊,这个是它等一啊,那如果是啊,等于三的时候,就是最后一个选项是最新的那个商品啊,我们让这个new等于一啊,这样的话,通过我们点击不同的啊这个选项去切换了当前记录的不同的索引,同时去请求数据,那传到不同的这个参数啊好,那我们来保存看看效果。
03:02
来注意看这个network啊,这里请求啊,那我还选到这个XR啊,这个out的话我不看了,在大家调试接口的时候就选择XTR,那接下来我点击这个销量啊,可以看到传的配置一以及这个SALES1对不对,好,那我呃接着点这个推荐啊,传的这个配置一啊,以及这个一对吧啊。那说明我们的这个呃,请求没问题啊,但是呃,我们来想一个问题啊,那就是为什么这个数据没有发生改变的,可以看到数据是增加了,是在下面增加的呢,对吧?所以呢,我们得思考一个问题啊,比如说我们在点击这个的时候,在请求数据之前,我们应该先把原来的商品给制空啊,把原来的商品给制空啊,那不滞空的话啊,重置。商品数据啊和分页你不重置的话就会出问题,好,那我们先来刚才这个商品的问题,大家也看到了,就是说我们点了之后,它实际上因为我们这里用的是最佳对吧,它又追加到原来商品上面,对不对,所以我们的这个切换就没有意义了啊,所以我们要把啊原来的商品先给滞空啊,用空数组。
04:08
诶,这样的话,一点击诶数这个商品变成空了,然后新拿到的啊,按照这个排序之后的数据就可追加到这里了,是这样的。好,保持来看看效果啊。来我们来清空啊,点那个销量。哎,是不是这就是按照销量来的数据,然后是看推荐的对吧,这是推荐的数据不一样吧,然后最新的最新的一个数据。对不对啊,那这样我们按照这个默认的就是哎什么都没有传吗?那接下来我们的质量也看问题,比如说我在默认的这个选项里面来,我分页分页,现在我我的当前页已经第三页了,对不对?好,现在我回过头来,我去切换推荐,你会发现诶。推荐的这个带的这个分页也是三,这明显就不对吧,所以呢,我们在对商品这个制空的时候,还要把这个分页的数据给它设置成初始值,哎,就让他从第一页开始再去请求吗?就说吧啊。哎,这个是增加这个啊排序啊条件啊,那为什么放在这里呢?放在这里其实有一个非常好的一个地方,就是说我们即使是现在选到了这个推荐对吧,那我们在进行这个呃,下拉处理跟分页的时候,你会发现。
05:17
是不是这个参数还带着呢,对吧。是不是这样的,你看,所以呢,我们放在这里属于是比较合适的。啊,那这个就是,呃,我们的商品的这个。分类的一个切换啊,那其实啊,写到这里呢,我们的首页基本上就完成了。那这小节就先到这里。
我来说两句