00:00
好了各位同学,那咱们呢,刚刚啊是对于这个排序啊,做了一个小复习。那接下来啊,是咱们这个项目当中要打的第一场硬仗,就是这个分页的开发。那飞轮开发呢,其实昨天呢,老师呢,也大概说了一下子,第一个就是为什么呀,就是为什么很多项目采用什么呀,采用这种呃扉页功能。你得先把这件事先想明白了。那就比如啊,比如电商平台。那你同时展示的数据有很多,咱就比如说有1万加条的数据,就是1万加。对不就同时要展示的数据啊,有1万条以上,哎,1万加以上。那你要注意啊,那对于浏览器而言,那么一瞬间渲染1万条儿数据,是会出现卡顿现象,还有可能会出现搁这儿一直啊转转转,一直加载。
01:03
所以说咱们才采用什么,才采用这种分页的功能。Unfairable。那当然啊。有的同学可能会说,老师。这个饿了么UI当中不是有这种分页的这个这个这个这个组件吗。对不,这个咱们应该知道吧,就是饿了么啊ET饿了么UI是有什么,是有相应的啥呀,相应的这个分页的组件。其实它使用起来啊,使用起来。超级简单。但是。咱们前台项目。目前不用。因为咱们后面呢,还有一个后台项,后台项目咱们会采用饿了么UI的分页组件。对不因为什么呢?因为老师需要你们能掌握什么呀,掌握自定义分页分页器的功能。
02:00
你最基本的一件事啊,分页器的功能,最基本的一件事,你得知道分页它是怎么弄出来的,它的原理是什么,这件事儿你必须得懂。好吧。好了,那之后啊,咱们先看一下子,昨天呢,咱们呢,已经拆分出一个全局的这个分页器了。为什么要给它拆分成一个全局的组件,因为咱们也看见了,在后面的模块当中,咱们还会用到这个分页器的功能,因此咱们给它拆分为一个什么呀?拆分为一个全局组件。对不?放在了哪?放在了咱们的汤闷资文件夹下的这个page。这不就是咱的那个静态的非页器的组件吗?只不过现在是一个静态的而已,就什么都没写呢,往那一放,那当然现在的这个全局分页组件在哪用呢?是不是在咱们的色模块下,是不是在用呢?在哪,你看咱找一下是不是在咱们的这个色齿模块当中,是不是在这儿,是不是在用。
03:03
为了减少你们心里的压抑,这个这个这个这个这个这个这个这个紧迫感,老师把没用这先先给它折上,在哪呢?是不是在这儿,咱们是不是在用,咱找一下。还在这儿呢,是不是在分线器,这对不老师呢,把民用地先给你折,这不就在这儿用了。对不?那所以说咱们现在只是在色模块当中展示了一个静态的非组件。那接下来的问题是什么?对于一个分页器而言。你都需要哪些数据?需要给这个废热器?也就是说,你想展示一个飞跃器啊?来,这是老师问的第一个问题。来啊。就是分页器的展示,它需要哪些数据,比如需要哪些条件。这块咱们得琢磨,咱就静静的往这先盯盯。
04:00
往这先盯盯。自己先琢磨琢磨。就是你能想到的,你就跟老师说,就是对于一个分页器而言,你需要知道哪些数据。那首先说第一个。这个分页器一共有多少页,你是不得知道。对不,假如说啊,老师给你举个例子啊,你看咱都需要哪些数据,就举个例子。现在默认是第一页,那我点击第五页是不是第五页?我点击第七页是不是第七页?我点击第100页是不是第100页。那首先说当前是第几页,你是不得知道,就这件事能想通?就是当前是第几页,你这条数据你得知道,因为将来你比如说你点击第六页,你是不是得向向服务器要第六页的数据进行展示,你点击第九页,你是不是得向服务器发请求了第九页的数据。咱一个一个来,比如说第一个。就是2.1第一个条件你得知道什么,第一个你需要知道。
05:03
第一个需要知道当前是第几页,对不?那咱们呢,一般的是用配置no字段代表什么,代表当前页数。对不,那这个你得知道啊,所以说对于一个分页器当前是第几页,你这件事你必须得知道。对不,第二个。你还得知道什么?每一页你展示多少条数据?对不?假如第一页展示三条,那第五页是不是应该也展示三条?第七页是不是应该也展示三条?所以说第二个咱们需要知道数据是什么,需要知道。哎,需要知道就是每一页需要展示啊,展示。多少条数据?咱们呢,一般的是用page size字段,哎字段。啊,字段进行进行代表。
06:01
进行代表。这个能懂不就相当于你得知道每一页需要展示啊,展示多少条数。对,不是展示三条还是五条还是八条。那当然还有一个东西,你需要知道谁一共有多少页。对不,其实多少页就取决于谁,取决于另外一个条件,你一共有多少条数据。所以说还有一个东西咱们需要知道,就是需要知道。一共有整个整个。分页器一共有多少条数据?对吧,咱们一般用total字段。经表示经代的。哎,老师问你啊,就这三条数据线能不能理解。配置no一般代表的是你当前是第几页,是第七页还是第八页。Page size代表什么?代表你每一页,就比如第五页或者第三页,它展示多少条数据。
07:03
那total是什么?Total你也得知道,Total是你一共这个飞热器一共要展示多少条数据?这个能懂不?哎,这个能不能懂,能懂给老师扣一个六,就先把这先给我搞懂。就现在这三个条件能不能搞懂,告诉给老师扣一个六。那现在老师问你,其实现在咱分析的这个过程当中,你已经还知道另外一样东西。就像到这块为止,其实你能获取什么,获取另外。一条信息什么信息?就到这儿。来。就是现在老师就假如说已经知道每一页,就假如说每一页有三条数据。一共有100条数据,我问你,咱暗含着一个条件,什么条件?什么条件,就假如说每一页三条数据,我一共是有90条数据。
08:06
对,你是不是知道一个暗含的条件什么条件一共有多少页。就这个能不想懂。其实就就举个例子,咱就说举个到这,咱举个例子,举例子举。哎,举例子,比如说现在每一页是三条数据。对不,那一共是90条数据。那它暗含着一个条件,什么条件就是一共是30页。一共是是多少,是30页。这个能想通吧,但是接下来老师有一个问题啊,什么问题,假如说每一页三条数据,我一共有91条数据。那我问你一共多少页?来回答老师,就假如说啊,现在每一页有三条数据,现在一共的是91条数据,你应该是一共多少页,是30页还是31页,哎,对是31页,为什么。
09:12
因为你30页你展你没有全展示,你可以多,但是不能少。哎,这个能懂不?这个能不能懂,这个能不能懂,同志们,比如说你每一页三条,一共91条,你三十一共30页,展示不全,那你只能让他多一页。你只能多,不能少。对不,那不就是91除以三向上取整吗?那不就31吗?对不?哎,所这个你得给我想通啊,来再来。就是到这儿的时候,咱可以获取另外一条信息,什么信息,就是一共多少页。一共多少页?OK了,还有一个东西咱们需要知道。这个东西是最重要的,就是连续的页码数。你看这。
10:00
什么叫连续的页码数,发没发现点点点点点点中间部分是不是有连续的页码数,你看咱上线的那个。就举个例子,你看不管老师怎么点,你看咱咱咱咱咱咱找一个淘宝吧。来找个淘宝。看这咱就看一下淘宝这个电商平台,他一定是有分页的,咱就比如说买个女装小黑裙,你看这啊。你看它的非页气一定是有连续的页码数的,你看嘛,咱举个例子,现在老师点击的是第五页。来看这样就比如说老师连续点击,或者再来第七页。走,你就看这它一定是有连续的页码数的,发没发现为啥?因为点点点点点点是不是隐藏了其余的所有的页码,而中间是不是有连续的页码数。看这。看这就这块真的很重要,举个例子,老师再点九,你再看。
11:00
它中间这一部分是不是有连续的页码数是几个,老师问你。看这连什么叫连续啊,就是点点点之后的这个点点点之前的这叫连续的页码数,你也知道,因为将来你要展示。所以说还有一个东西很重要,就是连续的页码数。OK吗?所以第四个需要知道什么?需要知道分页器连续的这个页码的个数。那一般是几个,一般要么是五或者是七。对不?你看你看淘宝这个连续的页码数是几个,是不是五个五个数字连连着的。对不,还有的项目可能是连续的是几个,是七个,就中间连的这部分可能还是七个。对不?那老师问你们为什么一般是五或者是七,就是为什么为什么是像这种五或者是七的这种这种什么数,这种应该是叫做奇数。为什么?
12:03
这个老师得告诉你啊,市场当中非热器连续的页码的个数要么是五,要么是七,一般都是奇数,那为什么是奇数?就为什么中间这个连续页码是奇数。不是说好不好看它对称。这能懂不?它前后对称,如果是连续页码是六个,它不对称。所以说奇数它是对称的,就这两能相等。就这能不能想懂?对不,因为他的对称,它看着好看一些,如果你是连续六个它不对称。就这能不能想懂,想懂的给老师扣一个一。能不能想走?能想走的给老师扣一个一。可以吧?所以说啊,一定要注意,需要知道飞热器连续页就是连续页码的个数,页码的个数要么是五,要么是七,一般不是五就是七,为什么是奇数?一句话,因为对称。
13:05
因为基数它是对称的,对称它好看。哎,对称称是这个称吧,对不?哎对走在一起对称,所以说它好看。那所以说对于一个分页器而言,你是需要这知道这四条数据。所以说一定要注意,所以说咱们总结一下,就是总结。总结就是对于谁,对于咱们的分页器而言啊,就是对于分页器而言,那咱们想自定义的前提是前提是啥,你需要。知道四个前提条件。哪四个前提条件呢?第一个叫做配置no,这代表什么?代表的是当前,是第几页?
14:00
第几页?还有个字段叫page size,这个代表什么?代表的是每一页。哎,代表每一页展示。多少条数据?第三个叫做total。这代表什么,代表。整个分页,整个分页一共要展示多少条数据?当然还有最后一个字段叫continues,这代表什么?代表分页连续的页码个数。所以说,如果说你知道了这四样东西,OK,你的扉页就能自定义出来。O,不OK,这老师为什么要知道连续页码的个数,因为你知道了,你才能知道这是谁,这块是谁。这个能懂不能懂的给老师扣一个六。这是咱们对于一个自定义分页的一个分析,就到这儿能不能懂。
15:03
可以吧,好嘞,老师。
我来说两句