00:00
好的来我们继续啊,那给大家扩展完那个数据和代理的内容之后呢,这节课呢,我们继续看啊,我们要看的是。世界满地。那么世界绑定呢,小程序里边说了世界的分类呢,有两种啊,一种呢是冒泡事件,一种呢是非冒泡事件,我觉得有一句话整呃说的特别好啊,所以呢,我给大家拎出来了啊,就是说冒泡事件呢,是看一个组件上的事件被触发以后呢,这个事件会不会向负节点传递。那如果说冒泡事件呢,肯定是会传递啊,非冒泡事件就是不传递,那么对应官网的出处呢,这儿我也给大家把地址填过来了,然后呢,我带着你们去看一下官网上在哪儿啊在哪儿。啊,看哪个都行啊,现在我打开两个啊,我把这个叉掉吧,那现在呢,我们需要在官网上啊事件它比较特殊啊,我们刚才学的数据绑定页面语法呢,在哪儿呢?在这个呃框架。
01:00
哎,微信嘛,语法参考里面在这里,这不有数据绑定吗?可是呢,事件呢,它是放到哪儿,放到指南里面。指南里面呢,把起步收起来啊,在这个小程序框架这一块呢,我们往下翻有一个叫世界系统点击过来啊,在这里啊,至于说什么是世界啊,我们已经很清楚了啊,在这里呢,我就不说了。那下面呢,就告诉我们,这不是世界的分类吗?到时候大家看官网也好啊,是看我的课件也OK。那我课件呢,是把一些重点呢,给大家整理好了就免,呃,就是不用你自己在官网上再去一点一点去找。好,我们往下来看啊,刚才呢,我们提到的是两种事件对吧,那么绑定这两种事件呢,分别用到的是bad。加世界名以及catch加世界名。啊,怎么写呢?看着啊,这by the tape。
02:02
败的是手段啊,Tap呢,是点击事件,相当于是我们移动端的点击事件,它执意过来叫敲击,敲打的意思。那么后面对应的世界处理的回调啊,这个呢,跟我们view中啊,或者right中是一样的啊,尤其是跟view中,你view中你比如说我们at click click对吧,这是一种方式或者是V杠啊on。对吧,那现在小程序里面你可以用,也可以用catch。哎,Bad绑定的是不会阻止冒泡世界向上冒泡,那说明它绑定的是冒泡事件,而K呢,绑定的是非冒泡事件。对吧,那这里呢,我们提到了一个冒泡啊冒泡,那什么是冒泡,我们需要去回顾一下啊,来到我们的笔记里面啊,在下边。啊,那么这个对应的笔记呢,我先说一下啊,最最后呢,我会给大家放到一个叫课堂笔记的这个文件夹里边,在这里边有来,那现在呢,我们来到笔记啊,在这儿我去写一个关于我们这个这儿呢来个一级标题吧,啊那这个呢是扩展内容。
03:21
呃,扩展内容。来,放到这儿。呃,现在呢,我们说一下这个世界旅游的三个阶段啊啊三个阶段吧,啊都有啥呀啊一个是啊我们说补货,然后呢,哎,执行目标阶段对吧,最后一个呢,是冒泡。啊,还要知道啊,我们所谓的补货是从啊外外对吧,向内去补货。啊,而冒泡呢,正好相反,它是,呃,从哪儿啊,从内向外冒泡。对吧?啊,举个例子啊,假如说我们有祖先元素啊,负元素以及子元素啊,子负啊组先元素。
04:07
那么当我们同时作用在这三个元素身上啊,假设他们三三个身上呢,都有一个颗粒事件啊,都有个颗粒事件,那同时作用上去的话,你要注意啊,那你最。最先开始他是先干嘛呢?先去补货,从最外边向里面去补货,注意在补货的时候,他是不会去触发这个事件的,一直捕获到最里边的元素,哎,发现里边再没有了,好,那么这个时候呢,我们需要在这儿去干嘛,去执行这个当前子元素身上的事件,对不对?哎,那这儿呢是捕获,那这是执行,那执行完了就没事了吗?哎,不能那么自私对吧,我们当初为了帮你去捕获你的点击事件,我们外边还没有执行呢,所以啊,执行完目标身上的这个事件,紧接着会继续的向外冒泡,冒到副元素以及主线元素的身上,进而去触发他们身上的这个。
05:10
对应的事件。哎,那这是这个啊,大家要知道好了啊,回顾了一下这个世界流的三个阶段以后呢,啊,来到了我们项目里面。哎,那现在呢,你应该知道我这为什么整了个负元素,整了个子元素来,接下来呢,我们去测试一下这个世界啊,首先呢,我通过bad来去给他绑定一下这个事件来,Tap事件,我这呢故意来一个啊,Handleler什么呀,Parent吧,嗯,然后呢,下边这个啊,我们也来一个啊,By the tap来,那这个呢是handle child,嗯,好了,那对应的事件的回调呢,我们需要在GS里面定义一下啊,注意那这个事件的回调放置的位置和data塔,以及我们的生命周期函数评级,所以呢,我就放到这,那这一点呢,跟RA一样啊。
06:03
而view里面呢,它是吧,像世界的回调啊,这些自定义的方法呀,是不是都会放到method的选项呀。哎,好,那这是这个啊,那一个是handle parent,那还应该有一个,哎,你这呢,就不应该是他了啊,应该是child。啊,我们也去定一下啊,别忘了啊,因为这个对象啊,对象的下边呢,还有其他的属性,所以后面要加一个逗号。来,那为了区分是哪个回调在调用,那这个时候呢,我去做一个打印啊,这儿呢,我们救救他。同时啊,下边这呢,我们叫它啊,Child。来打开我们的调试器啊,来到我们的conslo,先把这些清掉啊,刚才呢,已经给大家描述了啊,我们说bad绑定的是。冒泡事件。对吧,那我要问大家一个问题啊,你看我点击这个hello word hello身上打印几次。
07:04
对吧,啊,分别是什么。那也是他的顺序。哎,两次没问题啊,对吧,啊,首先呢,能够打印两次,那其实这两次一个肯定是父,一个是子呗,先打印水印。哎,对,先打印纸的,来我们看一下啊走。先打印子再打印父,那就这不就是典型的冒泡吗?执行目标冒泡冒到副元素身上对吧?好,那这是冒泡事件,那接下来呢,我把这个BY呢,给它换成什么,换成cash。别的我都不变来重新编译一次,把控制台清一下啊清一下,那这个呢,是刚才我们讲数据那一块,两秒以后修改数据啊,这个啊可以不用管它来,那现在呢,大家看到我再一点哈,打印几次呢。注意啊,现在我偏下去。
08:00
他是不是会阻止冒泡呀,所以应该打印一次,并且呢,就是它自身上面的这一次事件。对吧,哎,现在呢,是没有办法冒泡冒到负元素身上,被他阻止了,那想要触发负元素身上的世界也很简单啊,我们直接作用在负元素身上走,你看。现在呢,没有人阻止我呀,我是触发了自己的世界,哎,也没有问题啊好了,那这节课呢,主要是给大家讲一下啊,在小程序里面如何去绑定世界,一个呢,是用我们的。Band加世界名,一个用片加世界名啊,它俩的区别一个是冒泡,一个是非冒泡。OK啊,那这是这个啊,至于说世界呢,就是我们移动端常用的世界啊,它都支持,那这个之后呢,我们会用的越来越多啊。来,那这节课呢,我们先讲到这里。
我来说两句