00:00
大家好,我是上硅谷H学科的讲师张小飞,在程序员节日来临之际,在这里我给大家分享一道面试题,下面我们来看一下,那这一个面试题呢,是在你去面试view相关项目或者view相关技术的时候,他会经常会问到一个题。因为我们现在的前端的班的同学出去面试找工作,基本上应该有一半以上是左右相关的,所以这个问题呢,问的频率非常非常的高。他说的是什么呢?需要你说一说view组件兼通信到底有哪些方式,以及他们的一些特点。那要说明它呢,我们分为下面几个情况来看,首先我们要说一下通信的种类,有很好几种情况,你要知道。好,假设我们用框来代表主见,大家要知道主见是有各种各样关系的。
01:07
嗯。比如说哎,这就是啊,一共有四个组件,假设这个是A,这个是B,这个是C,这个是D。对吧。那我们通信的方向就会有这么一种情况,大家看一下,第一种是父组件向子组件通信,比如说A向B传递数据。再一种情况是子组件向父组件通信,那也就是说B向A传递数据。第三种情况是隔代组件间通信,什么意思呢?比如说A啊,像D。想办法要向他传递信息数据。这就是隔代组建了。第四种情况是兄弟逐渐之间通信,比如说B跟C之间,B向C,或者是C相B,哎,无非就这一种情况,那先要知道有这些情况。
02:08
下面我们再说啊,它实现这些通信。那方式有哪些?这里面view中实现主机通信的方式其实挺多的。啊。所以这个问题回答清楚还是不太容易的啊。第一种最基本的是prop。第二种是view做了一个自定义事件的实现,第三个是消息订阅与发布。这样一种机制,第四个呢是VIVO X,第五个S。啊,这个还是不少的。那基本上面试中能回答全的程序员并不占多数,所以只要大家把这个东西搞清楚了,你能完整的非常深入,像。浅出的给他回答出来就非常非常的好,对吧?好,那我们来分别说一下啊说一下。
03:06
Pro的方式呢,也就是通过标签属性传递,但传递了它可以传递一般的属性,也可以传递函数属性,那如果传的是函数属性,本质上是实现的是指向负通性。而如果穿一般属性呢,是负向子通性,这个要搞清楚。那这种方式呢?它的缺点非常明确是如果是隔代组件或者是兄弟组建这个通信就会比较麻烦。如果我们要实现隔代组件,通过pro通信,必须接助于组件。那如果兄弟组建呢?啊no啊,刚才不好意思说错了。啊。那如果是隔代组件。它要实现通信,必须逐层传递,也传递多次。
04:02
那如果是兄弟组件,必须借助于什么呢?父组件才能进行通信?啊,这个需要去。知道一下,而第二种方式呢,是view制定事件,也就view实现了一个制定事件的一种机制,我们可以通过它来实现什么呢?来可以用它来代替函数类型的pro传递,那也就是说实现的是子组件向父子源通信,那基本的代码就是我们在副主页里面。写子组件标签时,给他绑定制定时间监听,给他指定回调函数。而在子组件中,我们去触发事件或者叫分发事件,因为你提供了一种语法,在组件对象里面有一个方法叫多去指定世界名以及数据,而这一个数据就会从子组件传递给。
05:03
不足对吧。嗯,行。但是这个的缺点就只适合于子组件向父组件通信,那如果是隔代组件或者是兄弟组件就会比较麻烦。啊。下面一个啊,第三种方式,消息订阅与发布,这实际上是一种机制,那这种机制涉及到两个操作,一个叫订阅消息,一个叫发布消息,那最终你再去用的时候,必须用它的某一个时间库,在市面上布置一个时间库,我们这里面选择一个比较常用的一个库,叫pop sub减S。而这个库呢,向外暴露了一个对象叫pop,而这个pop呢有两个方法,一个是script订阅消息,订阅消息的时候实际上指定的是消息名以及回调函数。而我发布消息的时候,需要指定的是消息名,也就对应的消息名以及需要传递的数据,而这个数据最终传递给的是这个回调函数的第二个参数,其实这一点是它语法设计的不太好的地方,我觉得因为它的第一个参数是消息名,其实这个呢,我们基本上不用,但你不用还必须得写。
06:23
啊,而且通过实战经验要告诉大家一个事情,大家写的时候最好用箭头函数,这样能保证this的正确性。这里面需要注意好,而这种方式它可以适适用于啊,适用于任意关系的组件通信。也就是说,对组件间的关系没有限制。我们的前面两种方式,Pro和制定view,制定事件。
07:00
都是有一定的限制的,也就隔代组建和兄弟组建相对来说是比较麻烦的,而这一个是都可以的。所以有的时候为了方便,你就可以用pop up这样类似的库来去实现啊消息订阅发布,从而达到组件间通信的目的。那除了这种方式,还有一种是U的一个插件库,用来专门做状态管理的,那做状态管理实际上就可以去实现组件间通信了。啊。而且VX中管理的状态可以被所有任意的想得到这个状态数据的组件去读取查看,那对主键件的关系就没有特别的限制。啊,相比于top了,它的管理是更加的集中,更加的方便,那真实我们再去做项目的时候,基本上。
08:03
都会用VX来去管理我们组件的状态,从而去实现组件间的通信。啊,最后一种方式是lo,这是view特有的一种方式啊,这种方式呢,跟前面啊,跟前面我们。说的几种方式都不太一样,因为它通信的是带标数据的标签,哎,也就是说它通信的是标签。啊,这一个的使用呢,我们也在专门在我们有专门的测试的例子啊,这个我也建议大家,如果大家想好好的去学。好好的搞清楚需要去看一下我们的视频教程啊,在我们的视频教程里面有专门通过一个例子来去说明view中组件间通信的各种方式。
09:02
啊啊,这个例子呢,就是。再一个啊,没有案例啊,在这里面呢,就会专门去说到我们的note这样一种通信的方式,它通信的不再数据,而是带数据的标签。那这里面呢,我就不给大家去一个一个去写代码,大家如果需要这个代码呢,可以进行下载啊,我们的视频这个右侧是有代码资料的下载的,大家可以进行下载啊好。这是。这一个问题啊,就是关于view组件间通信的各种方式,以及他们之间的一个区别啊,各自的优缺点有哪些。好,这个问题啊,非常的关键,希望大家能够去花点时间好好的看一下。
我来说两句