00:01
好了,各位同学,那咱接着继续。那咱们呢,刚刚呢,是把是把这个产品的售卖属性这里给他搞定了。那接下来啊,咱们得处理哪呢。是不是处理这个放大镜这里。对吧。那咱们得一点一点的来先说谁呢,先说底下这。底下这里呢,说白了它是一个什么呀?是一个轮播图,用谁做的swap。对不?但是你要注意一件事,你看下咱们已经上线了这个项目,看到这儿啊,看这。咱这个网速啊。看这。虽然说啊,它是一个萝卜图,但是你要注意,跟咱当年写那个萝卜图一样。不一样。对不,咱们可以看,你看现在啊,老师一点上过去几张图是一张图。没问题吧,但是你会发现整个容器它显示的图片是几张?
01:01
三张。对不啊好嘞,那咱先一点看这啊。那首先说啊,咱们的这个子组件,这咱什么都没搞,只是把静态的组件是不是给他搞定了,以及把服务器的数据是不是进行替换。那咱们先找到这个组件啊,先找到谁找到这个叫image list是不是这。这不就是咱的轮播图吗?那轮波图swaper在使用的时候,咱以前说过就那几步,第一步包。对不对,看这有没有引包。引了吧,以及相应的钥匙,咱们很早以前就引过,在命点这些当中,钥匙是不是也有?对不,那第三步是干什么,第三步是。它需要结构咋的?完整。对不?对,那接下来最后一那个实力。那咱们当年是怎么做的,还记不记得?
02:02
老师问,你在mount当中搞行吗?Wanted的稿行不行?行,为啥?因为数据是我父亲给的。对吧,那当然咱当年选择的方案是啊,是不是watch监听对不wa watch你要监听谁,是不是监听这个数据。那咱们就给他咋的。给他捞回来。但是你监听的时候要注意一件事,什么事你只能保证什么有了。不是说结构啊,比如说你在这监听这条数据,就是监听数据你能保证什么。我能保证我现在用的数据是不是服务器数据是不是已经回来了,但是你没办法保证啥。微钢结构是不是已经完事?对,不就是监听数据可以保证,什么可以保证。数据一定是啥的OK的,但是你不能保证什么。
03:02
但是不能保证V杠放便利的啥。结构是否咋的完事?所以说咱当年还用到了一个小东西,叫谁来的?this.dollar。是不是延迟执行,这个毁掉什么时候会执行?当服务器的数据回来了。当V杠号都难了。便利完毕,是不是会执行?而且这句话咱曾经分析过,咱回首再找。再看一眼,这个网速还可以哈。来,咱们呢,再回首,再看一下这个let take这句话。咱找一下。呃,这呢,你看吧,在读这句话。在下次道更新循环结束之后。
04:02
啥意思?循环结束什么叫循环结束?微杠放是不是已经完事了?对不之后延迟直径回调,其实你就记住最后这句话就行了,看这啊。在修改数据之后,老师问你什么叫修改数据?什么叫修改?就举个例子,仓库当中的数据其实是被一个空对象,什么叫修改?服务器的数据已经咋了回来了,是不是叫再次修改?那就说这句话,Nice可以监听到什么?监听到服务器的数据是不是已经回来了?结构已经咋了?循环结束之后,是不是结果也完事了,是不是才会执行回调?就这句话,再再再再看,有点感觉吧。是不是获取更新后的到。也就是说,说白了,结果都咋的了。都有了,完了你再等是再初始化咱的数据对不?所以说这块初始化数据说白是不是要拗一个外的实例,那咱找一下谁。
05:02
SWPB。来咱们呢,找一下这。那记住啊,咱用的是外几5.3,是不是会出现五在点下午,那咱们找一下它的这个用法是不是就在这儿,那咱们现在老师问你引包的事是不是已经做完了。结果是不是也都有了,你差上是不是有一个外per实例了?对,所以说这里咱就直接把它咋的。带走,这是往这一放。对不,那咱稍微咋格式化一下。该要的要不该要的咋干掉?老师问你这个变量不要行不行?行吧,因为你根本就没没咋的没用上啊,那首先说容器是谁,容器是不是应该最外层的这个东西。那当然老师说我这里面是不是可以传到节点,那这玩意可以打啥。Ref,比如说咱们叫什么,就叫做K,那这一块你就可以换成谁。
06:00
是不是应该是this.dollar re fs.k对不?那你要注意咱这个轮廓图是垂直的嘛,不是啊,是啥是水平的direction这个配置对象相应的属性值默认就是啥。水瓢,所以删了就打了。就没了OK吗?而且要注意咱们的这个这这这这个小的这个萝卜图需要这个这个这个什么需要这个呃呃,这个这个这个叫路。不需要吧,这这个路咱也打的。咱也给他干掉,那当然分页器咱要不要。辐射器要不要?要吗?哎,老师你有分页吗?没有就是分页器咱也打也干掉,那当然左右的按钮咱要不要。左右按钮得要啊,以及滚动条得要吗?咱不要好了,那你看删报完之后就剩啥了。是不是就剩它了,那咱们呢,给它咋的运行一下,先看一下O不OK刷新。
07:07
看O不OK。OK吧,但是。你看现在老师问你现在在这个展示区域。只展示几个,只展示一个,那假如说我现在想让他同时展示几个,展示呃仨咋整。是不是还是得找人家的官网,呃,老师问下,以前这玩意学没学过,就是一次性斩杀。这回聪明了啊,咱也不说喜没喜个忘了是吧,好,那咱看一下。记住啊,这些东西都不需要你自己去写,你找人家的什么就行了,官网,但是你要注意咱用的是不是五,你得看五的文档。来咱找一下,呃,找一下他的这个API文档。在哪儿呢?在网格布局这里,老师直接告诉你在哪了啊,我就不在带你一个看了,行吧,在网格布局这你看。
08:07
它有几个东西叫leaders preview,咱读读。叫preview。设置slier容器能够同时显示的slider的数量,啥意思说老师我不懂,你看这。我问你现在这一一个容器当中是不是显示两。你要这个呢?大概能懂吧,比如说你能看见同时看见几个,OK吗?可以设置为数字。啊,可为小数小数不可,什么look对不?或者是凹凸等等,那说白了,老师问你,就这玩意儿是用来干啥?是设置你显示几个呀,而且他怎么用说老师我不知道怎么写好,人家有代码。在哪写是不是在这个配置对象里面加上叫leader preview为二,是不是就完事了,咱就直接给他咋的了。
09:05
捞过来老师问你是放在它里面吗?不是啊,这个是啥,是不是显示。呃,显示几个图片的设计。这往这一放,咱显示几个仨,那你看吧,咱瞄一眼是不是仨。那不一定啊,那万一不是万一不是多打脸是不刷新看一下。对不,你金刚现在老重点,我一点切换几个图。嗯。切换几个。你要老是这么一点,是不是这玩意儿没了。对,不,但是现在老师想做烟是什么事,我一点切几切仨。就有一点,谁也过去。他也过去说老师这玩意怎么写,来看底下的他的兄弟,还有个东西叫什么叫做就是这个叫sli per,哎呀,Per什么什么group。在轮播模式下,定义的数量多少为一组,可能看不懂,来看这儿。
10:05
一划是不是一个人这标一。这是几个三,你看一。这能懂不?所以说咱们想想几个,其实还是一个比较好看,这有一说一对不但是咱给他来个俩吧,俩俩一组行吧,所所以说咱们把它你就直接咋的。就直接给到老粉。早虽然咱图不多,但是呢,老师呢,这样吧,就默认就是一,那咱还是来一吧。OK吗?就是每一次。切换图片的啥,是不是个数?当然,你不写是不是也行?对吧,那你看现在点是不是一次切一个。对不对吧,在后边是不是就没了,因为你你这你想想,如果说你一次切几个切俩。点击一下。一下是不是就拜拜了,是不是点不了,那这样吧,咱就让他用默认值解一就完事了,OK吧,好再来。
11:07
那老师呢,把右侧的这里呢,都关掉了,看这那首先说啊,你看这。老师,鼠标以上谁是不是有一个这个。边框,给图片是不是加了个边框,但你要注意现在是用什么写。你想想,咱JS写啥都没写,是不是用钥匙写的?咱们先看看它是不是,你看它这块呢,是不是有图片。你看你看它底下的这个钥匙。咱找图片,这是个图片,你看他给他加了个啥。好,鼠标一移上。是不是加了个边框?加了个拍。对不?那老师给这给咱咋了,干掉了,但你看没看见底给咱留了个啥?是不是给这个图片加一个类名叫X5,是不是跟也是加个边框,是不是跟它一样。所以说你看咱先给他打干掉,比如说咱们不采用样式,全采用它是GS形式。
12:02
那现在是什么,就是你点谁点谁谁是不是应该有个边框。老师问你点谁点的,是不是图片。那你怎么能让他点谁谁有一个边框呢。就说白了就是点谁是不是给他加一个类名叫XT5,是不是就有高亮效果,这不给图片加的高亮。咋整?就是这个套路咋整?这是什么?I地方就是点谁谁加一个啥。加个类。这个套路学没学过?休息。不就这套路吗?只不过换成点击这原来咱是不是鼠标一下是谁有个背背景颜色。诶,套路是不是一样的。一样一样的了,那所以说你看咱学校怎么整。默认应该是第几个有类。第六个对不,所以说咱们给他来一个啥。
13:00
老师问你需要来一个什么,是不是想是数据,而且这个响是数据,它会随着用户的点击而发生啥?说变化对不?所以咱们给他来一个。来个叫date。啊,应该是他,那咱们叫叫car current index,默认不应该是负一,因为咱当年写说负一。负一啥是不是没有任何人,刚开始是不是有有有在高呀,那你要注意咱起始是不是第零个有。对不?那你看你要注意一件事,当用户点击的时候,你是不是要修改这个值。来再看一下哪个组件。是不是这个叫image list,你看一下子。他现在是不是就是零,那你要注意我现在点谁谁是不是应该修改它的值,咱先不改,老师问你,那默认是不是应该是第零张图是不是有类。说图片有,他是给图片讲的,说咱应该给他打个啥。Class。那类名叫啥叫X5吧。
14:00
叫A,什么时候会有这个链接?就是当你的current。Index等于谁?等于音带,老师问你这个音带是一个固定的值吗?不是啊,是零到几零到四。对不,比如你第一次变了,它是零。零等于零吗?等于是不是加一个类,第二次循环一一等于零,False是不是就没有,这能想通吧?所以你看默认是不是就是第零个。是不是有类名看一下,哎呀,妈写错了,我看一下吧。哎哟,少了啥。引号。所以你看上来是不是第零张图是不是有这个这个这个这个这个。这个小东西是不是有这个,但是你点的时候是不是得改它的值。点谁是不是点图片,那咱来。给他绑定个啥,点击谁at click,那这个咱们就叫change CU。
15:01
Dt in death,老师问你要不要出去?要你是不是要把你点击的那个图片,所以你是不是要传进去进行修改,所以这来个谁inex,所以这个套路一定要学会。那咱给他CTRLC,那这是咋的。啊,错了,不是watch,是谁,是MY。Me接收DS是不是就是它,那你要是不是要接收这个索引值,要干什么修改。响应式数据对不。这点current index。等于index对不对,所以你看你这回再看你是不是点谁。谁有内幕来,咱给它关掉看。是不是?这能懂不?那当然有同学老师。我不想写JS,写样式行不行?呃,我不建议写样,还是那句话,不建议写,就你工作当中,如果说你拿样式对比平比行,但是你在练的时候最好还是写上。
16:05
是不是写这种JS的,因为它确实锻炼你啥思维。这能不能想通?那么但是有一个问题,啥问题。上面没电。对不,老师说你上面这个放大镜跟底下这里用的数据是不是一样,我点击它是不是应该展示这个。我点击它是不是应该展示这个图,那当然默认展示就是它,我点击最后一张是不是应该展示最后一张图。那老师问你,他俩是什么关系?兄弟关系,那也就是说你底下这个兄弟好像要给他的大哥是送点东西,送的是。是不是送索引值啊,因为他俩用的数据是咋的一样,都是相同的数组,数组里面都是有几个元素五高,那你现在比如说你展示第四个,你是不是得这也得展示第四个。所以说他两者是作为兄弟组建,你看吗?
17:02
你看嘛,他两者是不是作为兄弟组建。那他俩是不是要通信?那老师问你,两个兄弟组建要通信,你想到了谁?兄弟之间通信萨行不行?啪啪萨行不行?行,那咱用吧。不用。刚有一个喊的很大声,叫自定义。事件是适用于什么场景?子给他俩是什么关系?兄弟,兄弟,你想要谁?是不是全局实验总监高?对不对,对吧,那所以说当你的兄弟组页一点击他的时候,是不是得1IT一个索引值给谁,是不是给他点的那个兄弟。对不?所以你点击的时候,不仅仅要修改当前的current index,你还要做一件事啥事。是不是要通知兄弟组建。当前所有。
18:01
对不,所以说这边写上来通知。自己的啥兄弟组件当前的索引值为,为啥数为几?那你这是咋写?这点Dollar 8.dollar。On还是一命?隐秘的,因为他是不是要送出来。对不?Dollar emit,那咱起个名字叫啥?就叫做。叫做get in行不行?那你送的值是谁是不是?this.carry index或者index是不是都行?那就说你兄弟通知了,那你作为他的兄弟,你在哪?你得接收在哪接收。在哪接受?在的时候。就像老师问你一件事啊,咱是不是以前学过道啊?事件只要绑过一次,你只要用户触发,是不是就会执行。
19:02
而说白了,全局事件总监说白是不是也是绑事件,你只需要绑几次,一次就行,对不?所以你在mount当中给他咋的?说绑了这个自定义事件叫market。我走,那这块是全局事件总线获取兄弟组建。传递过来的啥,是不是索引值,那咱看能不能拿到。this.dollar8点Dollar啊,第一个参数是啥来。是不是自定义事件的名字叫get in that,第二个是不是毁掉?但你回调要注意,这里面注入的可不是实验对象,是不是索引值。对不,那咱们先咋的。看一下音。那咱们瞄眼看一下。看这。走。比如说老师点的是它,所以这应该是11。
20:02
对不,我点他那是明显是没问题。那剩一个活老师问你,你看这个数据变了。没有为什么。不是说没展示。写死。咱是不是永远是第零当?对不啊。
我来说两句