父组件调用子组件的方法
这一讲我们主要给大家讲解一下这微信小程序中的自定义组件里边的这个 slot， 以及子组件调用副组件的方法，还有就是副组件调用子组件的方法。那首先的话，我们打开我们这个项目，给大家看一下这个 slot 啊，那什么是这个 slot 呢？你在官方文档里边你看一下啊， 就是我们在定义这个子组件的时候，你在子组件里边写一个 slot， 那这时候的话，你在调用这个组件啊，调用这个组件的时候，然后你在这个组件标签中间传入的内容，它就会放在这个 slot 啊，放到这儿，这就是这个 slot 啊， 那官方的意思就是在组件模板中可以提供一个 slot 接点，用于承载组件引用时提供的此接点啊，这就是这个 slot。 那接下来我们给大家看一下如何使用啊？那用的话很简单，就是我们 再调用这个，我们首先啊，比如说我们还是用这个，呃， header 组件，也是啊，或者我们在新界的组件叫一个福特组件啊，底部的一个组件，然后这里边首先新建个目录叫 fotl footer， 然后接下来的话，我们在这里边新建一个叫呃 component， 然后写个 fotl 啊，福特， ok， 那这时候的话，我们这个福特组结就新建好了，新建好以后，你这里边写你的对应的代码，对吧？啊？比如说这里边首先写个没有，然后我是一个底部组件，对吧？我是一个底部组件， ok， 那这个组件定义好以后啊，组件定义好以后，然后接下来我们在这里边我们可以加一个叫 slot， 呃， slot 啊， s l o t 加个 out 啊，这个是 out。 以后接接下来大家看一下，就是我们在调用这个子组件的时候，哎，调用这个福特组件的时候，我们就可以在福特组件中间写内容了，比如说接下来我们就在优这里边再给大家配置一个福特组件啊，那就在这里边配置配置，调用我们这个福特组件，那这里边的话就写一个 啊，叫 footer， f o t r footer， 然后这里边的话我们写对应的一个 footer 组结啊， ok， 那这样就搞定了。搞定以后，然后接下来的话，呃，接下来的话我们就在哪呢？ 就可以在我们这个 user 里边使用这个 footer 组件，那我把这里边 b r， 然后这里边来一个 footer， okay， 稍等，然后斜杠福特， ok， 那这样就调用这个福特组件，那接下来我们看一下这个用户页面啊，有没有调用这个底部组件，你看一下我是一个底部组件，是不是就出来了？那接下来的话你 再看啊，我这边多加几个。 br 然后接下来我在这里边我再写一个代码，比如说这里边写个 b u t t o 八腾，对不对啊？我是 我是一个按钮，然后放在了放在 s l o t 里面，那这时候你看我保存一下，保存以后大家再看一下，我们这个谁呢？我们这个用户啊，用户里边， 那这里边有，我是个按钮，放到 slots 里边，对吧？ slots 里边，现在就是他把这个按钮放到哪呢？放到我们这个子组件里边这 slots 里边，比如说接下来你再看，然后这里边啊，我们再写点东西，对吧？比如说 vivo， 我是个底部组件，然后这里边啊边， 但是 br 的话可能没法用啊，我们这边我是个底部组件， ok， 那这样的话相当于就是一刷新以后加载以后，然后这里边的话他会显示什么呢？我是个底部组件，然后这里边是个 slot， 对吧？就是 slot 放的内容，然后这是个底部组件 啊，这就是 slot 啊， slt。 行，那这个我们就介绍到这啊，然后接下来的话，我们再看这里边还有什么呢？还有就是我们刚才说的叫呃，重点啊，就是子组件调用副组件的方法，以及副组件调用子组件的方法。那首先我们看一下副组件调用子组件的方法啊， 那这里边我们把这个文档打开啊，打开以后这里边啊，那这个也写上，这叫副组件，第一个叫副组件给资助件缠织啊，啊，副组件， 副组件给子子子组件啊，子组件传直啊，这是一个。然后接下来再一个就是啊，副组件调用子组件方法啊，副组件啊 调用子组件子组件的方法啊，那官方文档里边的话好像没有写啊，我们就给大家直接来了， 在我们这个微信小程序里边，你要要让副组件主动调用子组件的方法的话，我们通过呃，这叫 this 点 select this 点 select 一个 component 来获取我们这个字组件啊，就是第一步啊，呃，调用词组件的时候定义一个 id， 然后第二步我们通过一个啊， this 点儿，呃， this 点，比如这里边 handler v a r 一个 handler 啊，等于 var 一个 handler， 等于 this 点 select coponent， 然后把我们这个刚才定义的这个 id 拿到，那这样就获取了这个字组件。那接下来的话，我们就可以通过这个叫 handler 点儿什么呢？ handler 点儿一个点儿一个 方法名啊，方法方法名啊，然后调 不用子组件啊，子组件里面的这个方法啊，这就是我们这个副组件调用子组件的方法。那我们首先给大家演示，演示完成以后我们再看子组件如何执行副组件的方法啊。 呃，那首先的话，那这里边我们要要什么呢？刚才说的要副组件主动获取子组件里边的数据啊，那接下来我们看一下，比如说在优的组件里边，我们要主动获取这个头部组件里边的这个 头部组件啊，你看头部组件里边有什么呢？有数据和方法。头部组件里边，比如说有一个 run 方法的，比如说这里边我们再写个叫 run 一啊，让一这个方法，然后接下来我们在这配置一下， 然后我们在这儿打印啊，打印 ctrl 点 log， 我是一个，我是子组件儿啊，子组件儿里面儿的状 run 一啊， see on console 点 log 啊，我是紫组件里边的 run 一这个方法啊，那接下来的话 我们想在哪呢？我们想在优点组件也优点页面啊，相当于我们这个副组件有的也就在他里边调用着呢，就是在他里边我们直接调用这个子组件里边的方法，比如说我待会我就直接这里边写个按钮，我一点按钮来调用子组件的这个方法啊，你比如说你看一下啊，就我们在下边来吧啊，就在这 啊，然后这边写个 botton 巴腾，然后巴腾直叫。比如我这里边写个方法叫获取获取子组件的 方法啊，就是相当于在副组件里边获取副组件的方法，那就是我 by 的一个 by 的一个啊， tab 等于一个叫 get 什么呢？ get 这个呃 child， 所以 h i chill 的弱啊， get to chill 的这个 iphone function okay， 那这时候你看一下啊，现在就是我们这一点，它触发了自己 user 自己副组件儿的方法，那我就在这儿啊，这叫副组件儿的方法。出发了， 触发了自己副组件的方法触发副组件的方法以后，我们想在副组件里边获取这个头部组件里边，就调用子组件里边这个绕法方法，对吧？ 啊，就是待会我们想的是啊，想的是一点这个按钮获取子组件的这个方法啊，这是我们副组件的方法，一点触发他，触发他以后，他再去调用子组件啊，子组件里边这个方法。 那这时候怎么做呢？两步走，刚才已经说了，首先在电动词组件的时候给他起个名字，起好了，对吧？然后接下来第二步，在我们这个副组件里边，我们通过啊，比如这里边有嗨一点，对吧？我们通过 z 点嗨一点，相当于就是呃给他这个呃 this 点儿啊，不是 this 点儿，还得我们就 v a r 一个 handle 啊， v a r 一个 handle 啊，然后这个可以去掉 v a r e handler， 等于是哪？等于 this 点 select select component 的 handle。 那这时候他要和谁对应起来呢？要和这里边他对应起来，对吧？ 然后接下来的话，我们再通过一个叫 header 点，你看啊，我就直接打印了，我直接通过一个叫 header 嗨点，嗨点就是子组件这个实力啊，嗨点点 run 一啊，那这就表示执行谁呢？执行副组件啊，副组件 父亲，副组件里面执行子组件的方法。 ok， 那就是我们保存一下给大家看一下啊，那是我们点击用户，点到用户以后，然后接下来我们点击，你仔细看控制台啊，我们点击这里边这个获取子组 组件的方法。走，我是子组件里边庄一是不就出来了？这就是我们刚才给大家讲的副组件调用子组件的方法啊，首先调用子组件时候给他定义一个 id， 就比如说我们刚才在这调用子组件时候给他起了个名字，对不对啊？起了个名字放在这， 然后接下来的话，那我们在啊，在我们这个呃副组件里边，我们就可以通过啊，通过这样，那副组件啊，这叫副组件获取子组件的十类 啊，获取到以后，然后这里边通过一个啊，我们这个实力点方法名调用词组件里边的方法，那这样就搞定了啊，这样就搞定了， 这就是我们这个副组件钓有字组件方法啊的写法啊，那接下来接下来呢，我们再继续啊。嗯，接下来的话呢，我们再看一下，就是这里边还有一个叫， 呃，副组件，你可以调用子组件的方法了，当然副组件也可以调用子组件里边这个数据，直接调，因为你获取到这个实力了，那你看啊，比如我们在副组件里边，我直接拿到子组件里边的数据 啊，直接获取嗨点组件里边的数据，直接获取是，那获取这个 message 对不对？那这首你看啊，这里边是个，我是头部组件幺幺幺，然后这是我们在这个副组件里边要获取他，那这我们就通过啊，叫嗨点点，一个什么呢？嗨点点，呃，一个嗨点就词组件，对吧？ data 点 msg， 那 c o n console 点 log 看一下，那这时候的话我们预习一下，你看一下 啊，看一下到底对不对啊？那这时候啊，我们在这里边啊，这时候在这点击获取资组件的方法， ok 吧？这是一个 头部组件幺幺是不是就 ok 了啊？其实这个是获取的资组件的数据啊，这叫获取资组件数据，就获取数据和方法是一个意思啊，副组件里面 直接获取子组件的数据啊，搞定，搞定以后呢，接下来我们再继续啊，刚才就是这几步啊， ok 的，没问题啊。然后这里边呢，再拿过来，通过这个 data 点 message， 这表示获取调用子组件里边的方法啊。 啊，这上边叫调用方法，下边叫获取数据啊，行，那这搞定以后还有一个叫啊子组件啊，子子组件执行副组件里面的方法啊，相当于就是子组件主动调用副组件里边的方法。那 资助件怎么执行副组件里边的方法呢？这个和 voe 里边也有点相似啊，但是 voe 点叉里边，那时候你看啊，官方文档这里边在哪写来着？我看一下啊。 啊，这里边有个组件事件，我们找到啊，你看一下，就是我们在子组件里边，我们要触发副组件里边的方法啊。触发副组件里边方法，我们首先在子组件里边通过一个什么呢？ 呃，通过一个 z 点叫 trigger inlet 来来执行副组件儿的方法，就这里边儿的话，你写个 my inlet， 对吧？然后这里边儿是你的数据，是参数，对吧？然后接下来的话，我们在副组件儿里边儿这里边儿啊，调用自主界首期绑定这个世界啊，绑定的话怎么绑定呢？就是你这里边儿，你， 你打算执行的就是你这里边广播的名字啊，我们可以叫广播的名字，叫吹歌啊，吹歌英文的，这叫 my 英文的，那至至少你在副组件里边接听这广播的时候，你这里边就要 by the by 你这个 啊，买瘾问他对不对？那这时候他就能调用副组件里边的方法啊，那接下来的话我们就给大家演示一下啊，我们就在这个 ur 组件里边给大家演示，你看啊，就比如说我们这个，我们或者在新闻里边演示也行啊，新闻或者就在 ur 啊，你回头就在这，呃，注意看一下啊， 比如说现在我们在这个副组件里边有个方法啊，叫 row 方法啊，这个叫副组件里边的方法，要注意看啊，这是在悠着，悠着，悠着这个页面，悠着这个组件里边啊， 然后我是一个什么呢？呃，打印啊，这里边没法 alert， 所以我们就 consider log， 我是 user u s 一二二 us 一二 user 页面 页面的方法啊， user 页面的方法，那我们 user 也可以叫做一个组件儿，它其实就是页面儿，对吧？ 呃，那接下来的话你看啊，接下来的话我们在哪呢？我们想的是在这个，呃，比如说在底部啊，我们在底部组件里边也是，我想在底部组件里边获取这个啊，执行这个， 执行这个副组件状方法，那这的话怎么弄呢？你看啊，首先的话，我们在底部组件里边，那我就在这里边写写点东西啊，底部组件，那就在这，我首先把这个 slotslt 要不去掉吧，我们这里边上刚才已经给大家备份了啊，备份了，回头看一下我这个底部组件啊，这里边有个方法啊，有个有个按钮啊，然后触发 触发副组件副情副情组件的 run 方法啊，触发副组件 run 方法， ok， 这个没问题，没问题以后，然后这里边也是 by 的一个 tap 啊， by tap， 然后这里边等于叫 get 啊， p a r 影替啊， get permant， ok， 没问题， 没问题以后，然后接下来在我们副这个，在我们这个这个组件里边啊，福特组件里边写个方法叫 get parent， 那 get parent 的话相当于获取副组件执行副组件里边的方法，对吧？执行副组件里边的方法 啊，别写错了啊，这里边叫 get parent a e s 六， ok， 没问题，那这时候的话，你看我一点按钮，我一点这个资助键按钮，它就会触发这个方法啊，你看一下，我们点击用户，用户这里边有一个，呃，用户稍等 啊，这叫触发副组件里边 raw 方法，这子组件里边点一下，那这边幺幺幺触发了，对吧？幺幺幺触发以后，然后接下来我们想执行副组件的，刚才啊，副组件就在这，想执行 user 里边这个 raw 方法，那这时候怎么弄呢？啊？那这时候这么几步啊，你看一下，就是现在就是子组件执行副 主页里边发第一步啊，我们需要，需要找到这个组建世界啊，找到组建世界，然后这里边有个吹歌英文的啊，吹歌英文的，就是吹歌英文的，然后这边写个妈英文的，这是你的数据啊，这数据啊，数据， 这是什么呢？这是参数啊，参数， ok， 就这表示啊，这，这就表示第一步，我们需要这样做啊，第一步，然后第二步的话，我们怎么办呢？第二步，我们再调用 调入子组件的时候，接近这个姨妈营的世界，也就是类似于他这里边啊，在上边这啊，就调入子组件的时候，比如说我们刚才叫福特组件，对吧？啊，那我们就是福特 f o t 啊， photo 组件啊，那这个的话，你需要在这儿有一个叫 by the by 什么呢？ by 这个名字和它一样叫 my in with， 那之后你只要这里边广播，下载广播 后，他这就会触发这个啊，这个福特组件绑定的这个啊，这个事件，对吧？那这样的话我们就可以在子组件里边执行副组件方法了，那这时候你看一下啊， 那这时候的话，我们两步走，第一步的话就按照这个来啊，第一步的话，我们在这个方法里边，也就是在这个方法里边，我们通过它叫 this 点一个啊 trigger， 英文特 啊，这个 e v e n t e v e v e n t 啊，这个英文它，然后这里边有三个参数，当然我们首先写两个，比如说我们这里边叫呃，叫啊， inmate， 叫叫叫，这个呃 parent 啊， p a r inte perent， 对吧？这个名字随便写啊， p a r in tee p a r p a r in tee parent， 对吧？然后接下来这里边有个数据啊， 子组件啊的数据，那这样的话，这样的话他就会触发水呢，触发这个副组件里边绑定的这个 party 的这么个方法啊，你看一下，首先第一步这样做，那第二步的话，我们要执行到副组件这个方法，那这是我们需要在调用子组件的时候，就在这啊，调用子组件，我先把这个去掉，调用子组件的时候，我们在这里边写一个叫 by the by the parent， 然后这里边啊写一个方法叫 run 方法， ok， 那这时候的话他就可以间接的执行这个 run 方法，你看一下啊，这我们在这稍等啊，就这么两步走，然后接下来我们在用户里边啊，用户里边 我们在这点击触发副组件 rav 法，然后这里边写的我是 u 字里边的 rap 法，对吧？触发副组件的 rap 法，这个按钮是在哪呢？是不是在子组件里边？但是我子组件一点，然后这里边有个 get parent， get parent， 然后在 get parent 里边儿吹歌儿一个英文特，然后正好我们在副组件儿里边儿 也绑定了这个啊，也接听了这个，这个啊，这个 parent， 对吧？就是你吹歌引用的，你看啊，我们在刚才是这吹歌引用的一个 parent， 对吧？我们在副组件里边这里边是不也绑定这个 parent， 所以他就能执行 rap 方法，对吧？那这里边你这个，比如说你叫 my， 你为 my e v 英体 my english， 那之后你在副组件里边你要接听这个，这个你就要改成什么呢？是吧？ get， 呃， 不对啊，稍等一下，我们在副组件里边调用词组件呢，就是在我们 user 组件在这，那这时候你就要改成一个 by 的一个 my 什么呢？ 蚂蚁用它，然后这里边绕。 ok， 那这样的话你看一下，我们再给大家执行一下啊，我们这时候我们点击触发副组件 drop 方法，是不？我是 usual drive 方法也可以啊，那也可以啊，呃，这就是我们这个叫什么呢？词组件执行副组件的方法 啊，当然这里边你看一下，这里边官方还给你提供了这个，呃，这里边，这里边这这么个参数，那这个是什么呢？这是一个数据，对吧？数据就是你在调用副组件的方法时候，你可以给他传直啊。传直怎么传呢？大家仔细看啊，就是我们在这里边，在刚才这福特里边传了个子组件数据，在副组件里边的话，我们 副组件里边是不是这里边执行绕方法了？那这里边有个 e， 对吧？那之后我们打印一下这个 e 啊，我们再打印一下这个 e， 对吧？ e 啊，那之后你看一下，我们再保存一下啊，看一下效果， 然后点击用户，然后点击触发副组件 drop 法，然后这里边你看一下啊，在这里边是不是有一个一点一个 detail， 然后资组件数据啊？现在就是你可以把副组件数据是不传资组件的数据是传给副组件，通过一点 detail， 是不是拿到这个数据啊？啊？ ok， 这就是这个东西啊。行，那这时候的话，我们这个，呃，副组件啊，资组件执行副组件里边方法就给大家讲清楚了，讲清楚以后这里边还有第三个参数啊，看一下，这边还有第三个参数， 那第三个参数的话，这里边他意思是可以指定一些东西啊，比如说这里边啊，世界是否冒泡，对吧？世界可是否可以穿越组结边界，对不对？然后这个世界是否啊？补补货，对吧？正常情况不用管啊，如果你这里边切套，就这里边有切套的时候，那你可以看一下啊，看一下第三个参数啊，第三个参数对吧？ 就是是否冒泡等等啊，这个回头自己感兴趣自己研究一下，正常情况我们就知道这个东西就搞定了啊。行，那这一讲的话我们就讲到这啊，这一讲我们就主要给大家讲了这个，呃，小程序中的这个 slot 啊，以及组件啊，以及子组件调用副组件里边的方法，以及副组件调用子组件里边的 方法，对吧？那这里边的话我们都用通俗的语言给大家总结了一下啊，这里边有这么几块，一个就是副组件给子组件传直，对吧？怎么传？然后接下来我们这里边还有什么呢？还有就是，呃，这个副组件调用子组件的这个方法啊，副组件调用子组件方法，包括这里边还有啊，子组件啊， 子组件啊，执行副组件里边有法法，对不对？包括子组件还可以给副组件传旨啊，那我们这个副组件传旨就给大家讲完了啊？行，那这一讲我们就讲到这啊。
粉丝1649获赞5009
相关视频
01:09查看AI文稿AI文稿前端 vivo 必会的副组件向子组件传植的三种方式，第一种方式就是用 v 八语， 首先我们声明一个变量 marry， 把这个变量传到子组件去，然后在子组件通过 plus 接收，直接渲染到页面，为了方便查看，通过写一个方法，每次点击那本都会加一看一下效果，试着改变一下没有问题。 第二种方式是使用 tfboy 和 engi， 这种方式无论组件层次有多深都生效。首先在副组件 pose 返回一个对象，然后传个 carry 到此组件去，在这个里声明一下。同样的也写个方法，每次点击 marry 都会加一切到子组件，通过 engl 接收一下，然后渲染到页面上，我们 打开浏览器看一下效果也是生效的。 第三种方式是使用 usb 插头，首先 在此组件里写上插槽的标签设置，如果没传默认就让它显示不就好了。然后再复组件里找到插偶组件，把我们的那个电量写上去，这就可以完成了。同样打开浏览器看一下是不是生效了，也是成功的。好，下期我们讲一下子组件相互组件通信的常用方式。
374web前端君
08:24查看AI文稿AI文稿各位同学大家好，这里是由 it 引点 come on 为大家提供的微优异基础加微优异无人点单无人收银系统项目实战视频教程。我是主角，老师大地 在上讲的话，我们主要给大家讲的这个副组件给子组件传植，对吧？那副组件给足组件传植的话，我们呃需要两步，第一步就是副组件调用子组件的时候，然后给 子组件的这个属性上动态绑定，数据绑定以后，然后接下来我们就在子组件里边通过破 pose 来接收副组件传过来的数据。那怎么接收呢？就是在这我们一种方式是通过这样的方式来接收啊，子组件里边一种是通过破 pos， 然后这里边有个数组来接收啊， 数组，然后另一种方式我们还可以通过一个呃，验证啊，就是我们要验证副组件传过来 合法性，我们也可以通过这种方式接受啊，这是两种方式，这是第二步，然后接下来第三步，那我们可以直接哎直接在子组件里面使用啊，这就是我们上一家讲的这个 副子组件船只的呃，这个方式对吧？副组件船只包括我们还讲了你副组件给子组件船只时候，我们可以把副组件的方法以及整个副组件传给子组件啊，这就上一讲给大家讲东西， 然后接下来的话，那我们给大家讲的是什么呢？我们讲的是两个更简单的方式，叫副组件主动获取子组件的数据和方法，以及这里边还有个子组件主动 啊，获取副组件副组件的数据和方法啊，我们看这两种方式怎么实现？首先看第一个啊，第一个就是 副组件主动获取子组件的数据和方法。那接下来的话我们这里边就不传了，你看我这个传值，我就先去掉啊，这是一个 副组件啊，首页组件，副组件，然后这是个子组件，没问题啊，这里边引入了子组件，并且啊在这里边注册了，对吧？然后接下来我在子组件里边啊，我这边把破 pos 也给他去掉啊，也去掉，去掉以后，然后接下来啊，我这里边这个胎头我也把它去掉啊，也去掉。 ok， 那这样就是什么效果呢？就是一个是头部组件，一个首页组件，那接下来我们想实现的是在啊， 在哪呢？在副组件主动获取子组件的数据和方法。什么意思呢？就是我们在子组件里边，比如说这里边有个 max， 对吧？然后这里边有个软方法啊，软方法，然后这里边写个二他，我是子组件的软方法，我是子组件的 软方法，这就是子组件里边有数据，有，有方法，对吧？我们想的是在副组件主动获取子组件的数据和方法。那主动获取副子组件的数据和方法。两步走。第一步啊，调用子组件时候给他定一个阿 e f， 还记得阿 e f 干什么的吧？第一步就是 第二，用紫组件的时候啊，定义一个 r e f， 那就在这啊，我们给他起个名字 r e f， 比如说等于什么呢？比如说等于一个，呃，憨点啊，用紫组件给他进行憨点，然后接下来的话， 接下来的话第二步我们就在这个，呃，就是副组件主动获取词组件数学方法。第一步，先用词组件手给他定一个，哎呀，第二步，我们第二步在副组件里边， 在副组件里面通过叫瑞斯，点到了瑞斯，点到了阿 e f s。 啊，点谁呢？点嗨的啊，然后点一个属性，对吧？啊？然后点一个方法，那这样就可以获取子组件的数据和方法， 这个河水有点瑕疵，还记得我们前面给大家讲的盗墓操作吧，对吧？这样的方式获取了这个黑的这个盗墓也将相当于获取了带黑的这个组件，对吧？那这样他点属性的就可以调用他的属性，然后点方法就可以获取的方法， 就是副组件主动获取子组件数据和方法的两步，对吧？那接下来我们给大家来一下，那首先在这调用子组件的时候，第一个按压负，比如等于一个叫 angel， 这个名字随便起的啊， h e a， 第二也写错，然后接下来比如说我们想在副组件，这是一个，呃，这是副组件，对吧？那 写在首页组件，我在下边写个按钮啊，写在下边来获取子组件的数据和方法啊，我就要在这写一个叫获取子组件的数据和方法，那就是我们首先执行是不是执行自己的方法，你就是艾特一个 like 等于什么呢？比如说要 gat 跳的 cxld q 的，对，他现在就是，我们看一下到底能不能获取啊？就在这点的时候，这里边执行的是副组件的方法，副组件是不是这里边有个方法， 有个方法。然后接下来我们首先 alt alt zes 获取资助阶的数据啊，那就是 zis 屌刀乱阿 e f s 屌 嗨点，那这样是不是就获取了谁呢？获取了这个盗版节点啊。啊，那这样获取盗版节点，那接下来你再通过这个节点啊，其实他就是获取自主界数据和方法，我们就把它类当做一个类似于盗 的一个东西，对吧？然后点一个，比如数据，数据有 ms 机，对吧？那这样看一下资助键里边是不是有 ms 机，然后我的副组件里边通过 这么种方式是不是就可以获取子组件数据了？然后来看一下，预习一下，这是副组件走，是吧？子组件的卖谁的？同理，我在副组件里边也可以执行水的，是吧？执行子组件的方法啊，那这里边你看一下，我调用叫 zis 点刀路阿 e fs 点黑点点弱， 那这就执行了水呢？是不执行了子组件的这个方法啊，那这种方式其实比我们上边这种方式更简单一些，对吧？ 这就是我们刚才给大家讲的副组件主动获取子组件数据和方法的两步走，对吧？第一步定一个二也要付，第二步，通过这种方式来获取子组件里边的数据和方法啊。行，这是一个我们就过了啊，这是主动获取。那 接下来还有一个就是我们在啊子组件里边主动获取副组件的数据和方法啊，那这个怎么获取呢？这里边也有也有这么个东西，叫瑞思点，瑞思点到了 p a r ent parrnt 点啊，这就表示去了副组件，瑞思点了潘瑞的点，比如说我们叫，呃，叫什么呢？叫数据， 那这样就获取副组件数据了，然后类似点到了潘瑞他点方法，那这样就获取副组件的方法了，那接下来我们看一下啊，比如这里边副组件里边有 mac， 我是 home 组件，然后这里边有个 alt， 对吧？ lt。 然后我把这个去掉 啊，我是 home 组件 rap 方法。那接下来我们在子组件里边主动获取副组件的方法啊，那接下来我就在这写个按钮，也是和副组件一样，把这个按钮拿过来。拿过来，我在子组件里边主动获取副组件的方法，那就是这里边给他 p ar ent 对他，然后接下来我在我的方法里边写这么一个，呃，资助件里边啊，这是，这是对他，然后这是我们通过瑞士点到了 p a r ent p a r 英体潘润特点什么呢？瑞士点到了潘瑞特点，然后这里边，呃，副组件里边有 mac， 那就是 mac 啊。那我们打印一下，看一下能不能获取副组件的这个数据啊？我在自组件点， 是吧？我是后母组件，是不是获取到了啊？获取到了啊，就在这，我点是获取到了。同理，我们这也可以执行副组织的方法，那就是 zis 吊儿 wp a r 应 t 吊什么呢？ dolple 吊这个， 呃，谁呢？副组件方法是不是这个软啊？软方法，这就在子组件里边主动获取副组件的 这个什么呢？方法，对吧？主动获取副组件数据和方法，这是另一种方式啊，我们这边不需要船只，你看我之后这个都没船啊，他直接这样用就行，就行。就在你在副组这边啥都没做，对吧？没船只，那我直接这样用就行啊。 这就是我们给大家讲的这个父子组件船只的这么三种方式啊。等会用哪种都行啊？用哪种都行啊，回头能满足你的需求就行啊，只不过人家面试的时候可能会问你，问你这些东西啊，父子组件、船只 行。那这一讲的话我们就先讲到这啊，然后这里边还有一个叫非父子组件，这个我们到下角再讲啊，这里边我们讲都是啊，父子，父和子，对吧？然后复合子啊，这一个，呃，交互就是父子间获取子组件，子组件获取副组件的数据和方法 啊，我们都在这这里边给大家有备注啊，回头把这个文档拿到那就能看懂了啊，现在这一讲我们就先讲到这啊。
22IT营
01:37查看AI文稿AI文稿如果我们想让副组件的数据在子组件中显示，需要通过副组件给子组件传递数据。 和 v 二一样， v u 三同样支持 props 的组件通信方式，只是语法上出现了一些差异，副组件传递数据还是使用 v 杠班的指令。此组件通过 define props 进行接收，里面可以是一个数组或对象。 在父子组建通信中，这种方式也是最常用的。现在只要父组建的数据发生改变，子组建也会实现同步变化的效果。 当子组建希望副组建的数据发生改变，则需要通过方法 去通知副组件进行修改。调用 defining meets 并定义要发射给副组件的方法， 副组件则需要绑定此组件定义的事件和 v o r 简直是一模一样。 下期接着来看 vigo model 的通信方式。
906茄子懂编程🙈
13:04查看AI文稿AI文稿大家好，今天分享的面试题是五由二中组建传值的方式，注意是五由二组建传值的方式，后期还会分享五由三组建传值。组建传值可以分为三种情况，第一种是副组件向子组件传值，第二种子组件向副组件传值。 最后一种啊，是同级别组建之间的船只，也可以说是兄弟组建之间的船只。这一小节先来分享第一种情况，副组件向则组件船只，或者说啊，是向后代组件之间的船只。 接下来我将介绍三种方法来实现辅助键向辅助键传知， 打开 o s 库的，现在看到的就是使用五 u 脚手架自动来生成的五 u 二项目。在浏览器 期中啊，来访问 local house 八零，八零就可以来启动项目。好的，当前项目已经启动了，这样的话再来返回 vsco 的 homewheel 作为副组件，因为是副组件向子组件串织，所以我们还要再来创建几个子组件，在 components 目录下再来新建第一个组组组件叫 layste 点 will you。 快速的来创建一下基本结构，来标记一下，这个表示的是词组件。 在复组件中进行组件的引用， 现在页面上它有一个 hello word 组件，这个组件我们就直接删掉了，要不然的话页面太长了。 引进来之后还需要在 compoints 这里进行组建的注册，注册完成之后才可以在实图层使用。那这是五 u 二组建引用的方法， 保存一下代码，看看有没有进来。好的组组件现在已经引用进来了，为了让大家更加理解的透彻一点，我在类似组件下面再来新建一层，再来嵌套一层，创建组件，这个组件我们叫 引 four， 点 view 快速生成结构哈，那这个组件其实就叫孙子组件，来一个 hr 标签 sound 组件，然后在 list 组件里面来引用这个 info 组件，也就是 sound 组件啊，默认生成的是我由三的代码片段，那么我们把它基本结构先来搭建起来， 然后再来进行组件的调用。这个组件叫引 four 啊，它的位置同样是在 comens 目录下的，引 four。 把这个组件也要进行注册，注册完之后再试图层进行使用， 保存一下代码呢？这里是不是也需要保存一下代码？先来看一看组建的欠套关系啊，欠套关系现在已经生成了，接下来我们就可以进行组建传植了，在副组建定义数据传递给组建和所有的组建。那我们 找到后面，我用这个复读键，然后在 detail 里面声明一个 message， 这个 message 标记一下，它就是复读键的数据。 如何将复读键的数据传递给读读键？首先能想到的就是通过属性绑定的形式，这种形式也是我们最常用的，使用 v 杠半的属性绑定， 将 message 传递给组组件，在组组件里面就通过 propose 来进行接收， 接收的方式也非常简单，传过来的是 message， 我们就接收 message， 那它的数据类型是 spring 类型，读串类型啊， 接收完成之后就可以在数据统直接进行调用。再来一个 h e 标签了解一下呢？就是辅助键传递 过来的数据。那传递的数据是啥？就是 message 刷 复读键传过来的数据。嗯，这个数据是不是已经获取到了，这就是第一种情况，也是最常见的一种形式。但是这种形式有一个缺点，不能直接传递给孙子组建， 也就是那个引复组件。如果所有的组件想要使用这个数据要怎么办？是不是要在类似组件里面再做一层为杠半的？首先绑定的形式传过去， 再传一遍，很繁琐，这是第一个缺点。第二个缺点，子组件不能直接来修改复组件传过来的数据。例如我可以在这里再来添加一个吧台按钮，为这个按钮绑定，点击事件 笔填，然后在 matters 下面定义这一个方法，定义 必填方法。好的，这个方法又做一件什么事情啊？ face 点 message 是不是拿到辅助键传过来的数据，我直接重新复制成 a b c， 刷新一下页面，然后点一下 f 十二，注意看控制台，点击这一个按钮，直接报错了。我们先不管能不能生效，但是是不是不能修改 这第一种形式，有这么两个问题，接下来我们就来演示第二种形式。第二种形式啊，是就不通过属性绑定的这一种形式了，我们直接将属性绑定，把它删掉， 我们下代码，然后在 laser 这里也需要把 promise 进行删掉， 那 prof 删了之后，上面的 message 数据也需要删掉，要不然会报错。 好的，那不通过属性绑定的形式，我们通过什么形式啊？在这里面有一个生命周期，是不是叫 create 生命周期函数，在生命周期函数里面，我们就可以来调用一些 a p r。 那我们要介绍的这一个 e p r 叫 dollar parent， 我们来打印一下 consume 点 log 叫 this 点 dollar parrot， 有这样一个 属性，然后看一下控制态里面，实际上拿到了一个组件，而这一个组件 dollar parent 表示的是当前组件的副组件，那实际上 也就是 home view 组件，而 home view 组件下面有数据啊，有 message 数据，所以可以直接再来点一下 message 数据，如果能点出来，说明它确实是它的复读键， 来看一下，拿到的就是副组件的数据，那这说明啊， this 点到了 parent 就是表示当前组件的复组件，那能不能直接在视图层进行使用啊？我们可以尝试一下副组件传过来的数据啊，通过这一个 dollar parent 点 message， 看看能不能拿到副组件的数据，通过这种形式也可以拿到。好的，这种形式 swind 组件能不能直接去使用啊，我们也可以尝试一下 找到引附，引附是不是孙子组件直接在后面，我就来一个 dollar parent， 那请注意， dollar parent 我们刚才说过，它是当前组件的副组件，但是我现在要拿副组件的副组件父亲的父亲，所以还要再来点一层啊。 dollar parent 再来点 message， 这样在子组件里面是不是副组件的数据也可以拿到，啧， 好的，我们再考虑一下这种形式子组件能不能直接修改副组件的值，那也要尝试一下啊。 好的，点击这个按钮，我们来进行一下修改，也就是 this 点 parent 点 message， 是不是拿到了复读键的数据，我直接来做一个修改，把它变成 a、 b， c， 点击按钮，确实啊，已经修改了负的内值，变成了 a、 b、 c， 并且控制台必是没有报错的啊， 这说明可以，那所以这里可以往外延伸一道面试题啊，词组件如何直接修改副组件的值？大家知道了没有？再说一遍，词组件如何直接修改副组件的值啊？是不是通过 z 点到了 parent 就可以直接来做修改？这是第二种形式，但是这种形式根本就不算传职，因为副组件根本就没有传递数据这个步骤啊， 他只是定义了一个数据，但是并没有做数据传递是不是？那接下来我们要看第三种形式，第三种形式啊，是副组件直接把数据传递给后代组件，那这种形式就是通过依赖注入的形式啊， 依赖注入 我们直接 要把传递的值放到这里，把它捋探出去。例如现在要传递一个什么值？ mac 之一吧， 复读键依赖数据，随便标记一下。 好的，就通过这个依赖猪猪的形式，就可以直接将 message 一的 message 一传递给后代组件。注意，这一次我说的是后代组件，不管是子组件还是孙子组件，只要是他的后代都可以来使用。 怎样来接收啊？先来看第一种形式啊，接收其实也是非常简单，通过 inject 进行接受， 那它是一个速度，在速度里面就来接收型了，传递的值叫 message 一，所以呢，我们就接收 message 一，现在接收过来了，就可以直接进行调用。 在最上面吧，来个 h e 标签，这个是副组件的依赖传递的依赖数据啊。 好的，就这样来使用。行了， mac c 一，那刷新一下， 复读键的依赖数据就传过来了，这个没有问题。然后我们再来看一下在，呃在这个引复 swind 组件里面能不能直接使用，肯定也是可以的啊。 我先把这个结构给搭起来，然后我们再来通过 inject 进行接收， match 指一好的我 就直接将这里删掉了，我们就通过 message 一进行获取那副组件的依赖数据也可以拿到。 第三种形式就是没有经过德组建，而是直接把数据传递给了后代组建。 那这就是今天晚上分享的内容啊，复读键向组组键传值，给大家介绍了三种形式。
07:22查看AI文稿AI文稿那么有局部的组件，有全局的组件，那么组件之间啊，也会存在着一个数据传递啊。所以说呢，我们在这边来看一下 properties 完成副组件啊，传递到子组件， 因为组件分为平级的，那叫兄弟之间的组件。那么有父有子的在这里边呢？那你比如说我们看这张图，看这张图你能看出来， 在这里边 demo 显然是 child 的一个负是不是？那从 demo 往 child 传， 翻过来，从拆的往带帽里边传，这都是寄到我们组件和组件之间的一个直传递的位置啊。那在这里面传递的时候，我们使用什么呢？使用它，使用我们的 p、 r、 o， p、 s， 实际就是我们的我们所说的这个属性 properties 啊。 properties 它是简写的啊。来我们来看一下，咱们来传这个事啊。那么首先呢，我们在这个里边来 找到我们的子组件啊，这实际是我们的一个子组件啊，在我们的子组件里边呢， 这是一个子组件啊，我们现在来，我们完成一个负啊，传到子的这么一个过程啊，这是一个子组件，在子组件里边呢，我们在这里边来， 我们拿到我们的在这里边你是能看到它这边是有个函数的啊， defun pops 啊， defun pops。 那么我们在这里边来，你能看到这个数组博士什么意思？在这里边传递一个或多个值都是可以的 对不对？传递一个指或多个指都是可以的，这个只是你参数的名称而已。注意了，这是你参数的名称而已啊。那么我们在这个里边来吧， 我们在这里边拿到谁呢？拿到我们的这个参数就是我们所说的这个 count 啊，这是子组建的啊，这是子组建的。 那值具体从哪来呢？当然是从你副组件传过来的。来，先把子组件先做了啊，先把子组件做了啊，做完了之后呢，我们在这里面来，我们在这里面再来一个， 我们来做两个字组件啊，这是一个字组件。在这边呢，我们来 quay 再来一个啊，重命名一下啊，这个呢，我们就叫 two。 那这个呢，我们直接吐好吧。啊，这个呢，我们直接吐啊，吐完了之后呢，我们在这块来加一个 to 啊，上面的这个名称呢，我们说他都是一样的啊， 能看好了，我在这边定了两个组件啊，两个组件那么好了，两个组组件呢，我们在这里边根据我们刚才看这张图哈， 我们把我们的 demo 都作为这两个子组件的一个副组件啊。那所以说呢，我们来找到我们的副组件来了啊，到这来啊，然后把这些都给他关一关，都给他关一关啊，不要这态度来。这个呢，我们倒进来之后呢，我们 再来导一个，因为我刚才不是做了两个字组件吗？啊，做了一个 chat， 又做了一个 chat two。 好，我把两个字组件都导进来，都导进来啊，都导进来之后呢，我们在这个里面来创建一个参数过来啊， 在这里边我们定义参数啊， const 来，我们在这边给他一个一百处置啊，我们在这边给个一百好了啊，这个是我的 第一个子子组件。在这里面呢，这个呢，就是我们的第二个子组件啊，两个子组件。但是你要注意了，你这两个子组 键里边是不是有这么一个属性，你看这不叫属性吗？这属性叫什么名字？是不叫 cont， 你注意了，这个属性叫 cont 啊，注意了，这个属性叫 cont。 那所以说我们在这个里边来 拿到这个参数 com 把谁扔过来，把它拿过来啊，把它拿过来。 那么下边的这个呢？我们也是这样来的，也把它呢取回来啊，我们在这里边也把它取回来，取回来之后来 直行你看一下啊，子组件一和子组一样二是不都能拿到我们副组间给的这个一百，看我们这啊，看这 是不是它的属性， cond 是一百，这个是不是也是它的属性， cond 是不是也是一百， 因为什么呢？这个一百是谁给的？是不是你这个 demo 给的，你看在 demo 里边是不是有一个一百，这个一百是不是给到了他两个子组件上去了， 一定要注意这个事啊。那么这个表示谁来？我们在这边改一个吧。这个呢，我们管他叫什么，我管叫 就 a、 b、 c 吧。啊，我们管它叫 a、 b、 c 啊。在在这里边这实际是表示你的属性啊，这个表示你的属性来，这个属性呢，我们叫 a、 b、 c 啊，我们来改一下它啊，那么你把它改了之后，我们改了它吧。在这里边这是一个参，这是一个属性，你是不叫 a、 b、 c 啊， 这个是谁？这个是不是你定义的这个参数啊，这个参数是不带着一百给到你这个属性 a、 b、 c 上去了。 我们这样看呢，会看的更直接啊。这样的呢，我们看的会更直接啊。来，我们来刷一下啊，走一下啊。这个是不是我们子组建一的一百子组建的，一的一百给谁了？是不给 abc 了， 这个 abc 是谁给的？是不是我们 demo 里边的那个框的带着一百给到这个 abc 上来？所以这在这边你一定得清楚清楚一个什么事，你在这个里面这是你属性名称啊，这块呢我们一定要注意啊。在这里边我实际我们定义的是 组件，组件，组件的属性名称。那所以说你在这里边输出的也是你这个属性的那个值，而属性的 这个值是由谁给的呢？是由你的副组件，这呆模肯定是你副组件吗？因为这个这是整个是呆模组件，你是在呆模组件里边加的他，他不就成了你的副了吗？ 你是在你副组件里边拿到了这个 count 带的一百给到你这个属性上来了 啊，一定得清楚这么一个传递过程啊。一定得清楚这么一个传递过程啊。这个呢是父传子 啊，这是复传子啊。当然了，我们在这里面呢把这个呢都列出来了啊，这个当然是一个复传子的过程啊。
1程序员修
01:11查看AI文稿AI文稿哈喽，大家好，我是瑞塔。今天有个小伙伴在 vivo 项目中父子主见传贪时遇到了这么一个问题，父子见第一次传给子主见的值在子主见内可以正常接收，并显示，后面父子见中的值发生变化后，子主见的值却没有不更新， 这是一个比较常见的问题，这是为什么呢？又该怎么解决呢？原来子组件并立了变量就是 list 去接收复组件传过来的 parent list 只会在第一次初始化子组件的时候达到值并复值 面从副组件传过来的值改变了，却没有重新给子组件中的变量负值。所以这时候我们可以通过 watch 动态监听传过来的值的变化，并给子组件定义的变量重新复制。 这是一种解决方案。还有一种解决方案就是我们刚说子组件的那个变量只在组件初始化时被复制，那如果每当副组件的值发生变化，我们就重新渲染一下子组件，是不是就可以保证子组件能够一直到最新的值呢？继续这个想法，我们就可以在副组件中给子组件动态绑定一个 p， p 作为组件的为一标识，只要 改变，子组件就会被重新加载，子组件的变量就可以被重新复制。所以我们只要在传给子组件的值改变的地方把 p 的值也改变一下就可以了，通常我们用时间戳，这样能够保证 p 的。唯一 有遇到过这个问题的小伙伴，可能听起来比较清晰，还没有遇到过的小伙伴可能就有点犯迷糊了。需要文字版以及代码视力的小伙伴可以评论区留个言，到此结束啦，关注雷塔，每天进步一点点！
624程序员Rita
00:40查看AI文稿AI文稿副组建如何向子组建传递数据？借助于 props 的帮助，我们能够同副组建向子组建传递数据。如何来实现观察代码中的吃力？我们在副组建 parent component 中 render 子组建 child component， 通过提供一个 prom counter value， counter 值就从辅助键传递到了自助键。可以在自助键中用这样的方法来使用辅助键传递过来的数据。 由代码所示，使用 props 第二 counter value 来显示辅助页传递过来的数据。
5许点派
10:17查看AI文稿AI文稿不论是在蕊爱中还是在小学中，咱们都讲过怎么怎么通信呢？就中和使用父相子以及子相父的呀，是吧？哎。所以说呢，兄弟主人之间的通信一个观念点是什么呀？他们得有一个相同的 副主见对吧？哎，副主见哎。哎。所以说呢，对于不相干的两个主见之间呢，是没有霸气同性的。所以怎么办呢？后面我们啊，明天咱们会讲一个框架。什么框架呢？ voex 啊，有人也叫 voex 是吧？啊， vos 啊。那么他是专门解决主电电通信的，跟我们以前讲 reax 里面那个瑞大斯还有音箱吧， 是一样的啊，是一样的哎，直播比他要更简单一点哈，更简单一点啊，因为没有，就一个字简单啊。所以说用的人太多呢，对吧？用的人太太多啊。 啊。好了，那么怎么通信呢？就是一个主见将书记传递给副主监，然后呢，再由副主监将书记传递给另一个主见。这样是不是时间呢？这两个主见的一个通信呢，是吧？哎，我们来实现一下。我们来实现一下啊，兄弟主见之间这个通信啊。 嗯，好。新建一个文件零九兄弟主间间通信。哎，兄弟主间间一个通信。 嗯，好了，我们还在写一遍啊。 div 净化 app。 然后上面是 h 一里面啊，咱们去选一个 mac， 这是 party 的啊。 好了啊，然后下面是个 a 十二，一个是 chill 的自主键啊。然后呢，一个是 after， 另外一个自主键。 哎。然后呢，咱们去引入这个脚本啊，当前目前下面的第一次下面的。呃，这是零九哎，点 cs 文件。好，我们在零九点 cs 文件中把这些逐渐定义出来啊。首先呢，咱们去引入 vivo 啊，引入 vivo， 嗯，好。就是你有没有一二是井号 app， 这次呢是一个对象好，里面是一个啊， message 啊，这个 message 啊，好。我们在这里面使用两个主见啊，注册两个主见，一个叫 child， 一个叫啊子， 嗯，好。 let 哎，茄子。等于没有点 extend 啊。去定义 template 哎，这里面呢，咱们实现一个数据作用绑定啊， diy 一个 input 哎， we got model 哎，等于一个 inch 哎，嗯，好。然后下面是一个 h 一 哎，然后呢，下面是一个 h 一，这是这个翘的啊，现在这个是 inch 啊，好，那么我们在对策里面有这个 inch 这个数据是吧，对吧？ 哎，好了。比如说是一个呃哈喽呃。然后呢，我们有另外一个主见啊， like 一个 other 哎，等于没有点 extend 啊，点 attend 好。 time plate time plate 嗯，还是里面是一个 h 一哎。然后里面啊，咱们去选一个嗯， 这个阿泽吧啊，一会咱们去选这个数据啊。好了。然后呢，我们打开浏览器啊，一看这两个主键啊，这个主键怎么样都出现了对吧？哎，都选出来了好。那么现在我们的任务是啊，在这里面输入是不是希望阿泽能够显示出来呀？ 然后呢，我们说 child 与阿德是不是一个互为兄弟关系啊，但他们两者之间不能直接通信怎么办？先将 child 出去书传递给 party 的显示啊，再由潘人的将数据传递给阿德区显示是这俩过程吧，哎。所以说呢， child 传递给 party 的，这是一个入间箱 复电通行过程。然后呢，潘全就给阿德是一个自助间箱啊，自助间箱六件通行的过程对吧？哎，咱们把这两个过程来实现。就 首先是自助键向负右键通信啊，怎么通信呢？首先我们啊说有两种方式，咱们先一个一个来先说一下哎，传递方法，看一下传递方法啊，传递方法那就是让我们给他一个 message 哎，哎，来一个 mac 啊，对啊，之前咱们讲过啊，那么我们说副主任向自主间通信的时候注意啊，哎，这里面咱们没有写是吧，咱们补充一下吧。啊，就说呢，如果啊，副主任向自主间通信啊，注意啊，如果我们说这个是属性名称 哎，多个单词哎，横线分割啊，哎，然后呢？我们说在接收的 时候啊，在接受的时候我们要使用什么方式啊？通行命名啊，接收属性啊，那么属性名称 哎，驼峰是命名啊，所以我们在这里面咱们给他演示一下。比如说呢，咱们这个叫呃，呆萌 my size 吧，行吧，可以吧，哎，呆萌 my size 啊，冒号啊， my size 等于啊， reseal my size 啊。好，这个方法谁的 谁的呀？是副主监的呀，哎，咱们定义在副主监中啊，咱们定义在副主监中。注意看好，我们在这里面定义这个方法 哎，好 consulate 啊，这个 message 哎， consulate 这个 message 啊， 好了，然后呢，谁的属性啊？是跳的自助键的属性啊，哎，自助键去接收属性 哎，接收属性哎， probess 哎，接受属性什么属性呢？然后咱们说横线怎么办？说通过生命名啊， 是吧，哎，同时命名啊，好了啊，然后呢啊，然后呢，我们俩在这里面去执行。那就是啊啊，处理完成的时候啊， created 第四点啊， damamasi 指执行传递数据。第四点应酬啊好。那么我们创建的时候注意看啊，这个副手件啊，有没有接收哈喽，你看是不是接收到哈喽了， 然后把它存储进来，存储数据啊，存储数据哎。所以说呢，咱们来回顾一下。第一步传 传递方法第二步右键缺接收属性第三步啊，是不是执行方法让 哎第四步我们在这里面怎么办？哎数纯种数据啊四步清思路清晰吧哎好。第四点 message 等于 message 啊。再看一遍第一步肯定方法第二步接收方法第三步执行方法第四步哎，纯种数据是吧？ 是不是这么四步啊？好，来看一下。我们一刷新哎，有哈喽了吗？有了。然后自动键更新的时候，是不是他也要跟着更新呢？哎所以说，我们接近出局的变化 哎，进行应酬的变化。然后呢，我们再去执行方法传递数据哎执行方法哎， 传递数据一时间啊，一时间再问 message 啊，传递一时间 inch 好，我们去刷新啊，看看上面更新了吗？更新了是不是啊？然后呢，再由复数键将数据传递给另外一个自助键吧，哎，传递数据线 哎哎好，那我们给他传递一个属性啊，比如说呢，哎，这叫 parent message 哎好了。然后呢，哎，等于哎等于啊，这个 message 好。那么自主间是不是接受这个数据啊，是吧哎好。那么这是谁的主见阿的主见。所以说呢， probes 里面我们去接收还是 行业分给大家怎么办？厨房是命名啊哎然后有了一个潘特 mac 啊，这是接收的数据哎所以说副样子非常简单两步第一步接收，第二步去 就使用啊，哎，好，来看一下，来看一下。我们一刷新，哎，好，你看复制键，接受了，自助键也就有了，我们再给他更新，你看他是不是也就同步的跟着更新了是吧？哎，好，我们说自助键向复联通信，除了传递方法之外，还有第二种方式。什么方式啊？ 说绑定事件呢，对吧？哎，第二种方式自定义，是不是自定义事件呢？哎，比如说呢，我们给他一个，嗯，艾特这个戴某，这个事业名称叫什么呀？戴某 啊。当然咱们说你用爱的也行，是不是用微钢啊，之灵也可以啊，是不是？哎。然后咱们说什么时候发送啊， 创建完成的时候咱们去发送啊，就是一时间到了 amid 去发送这个 demo 哎，然后呢，数据呢？就是一时间音储好。那么注意看啊，我们一刷新，哎，树间接收了吗？树接收了，然后更新的时候不行了是吧？更新的时候是不是也要去发送啊？ 第四天到了 amid， 哎，去发送这个 demo。 第四天 inter 啊，一次 inch。 哎，这回咱们再一刷新，但是也就实现了，对吧？哎。所以说呢，自定时间，你用 vigang 方面也行，你用 这个艾特依法堂，哎，是不是也可以啊，是不是也可以啊，对吧？哎。总之我们说这个事件绑定，哎，这个准 通信是不是实现了啊？所以这是兄弟主见。当然呢，以后主见多了，那你来回通信成本是非常高啊。所以明天啊，咱们就讲一个框架，叫 vs 啊，是专门解决主见之间可能出具供应数据问题的一个框架啊。
3爱创乐育
01:10查看AI文稿AI文稿子组建如何向副组建传递数据，需要一些技巧，可以分三步实现第一，在副组建中创建一个 cobec 参数不已所需的数据第二，将这个 cobec 作为一个 prom 传递给子组建 第三，使用靠带的从自助键向后左键发动数据。我们来实现一下从自助键将更新的开放式伴侣传递到后左键 自主间内创建一个 cobe 并传递给字组件。如代码所示，创建了一个名为 cober 的方式，参数为 belly from child， 接受从字组件传递过来的数据， 然后将这个方式传递给自主键。在自主键的代码中，我们将负主键传递过来的 counter value 复制给一个变量 child country value。 在巴特克里克事件中，我们把增加了的 childa counter value 传递给了 props 点 call back on， 也就实现了从此组建向副组建传递数据的目的。
01:44查看AI文稿AI文稿view 中父子组建如何通信？在 view jazz 中，父子组建之间通常有以下几种方式进行通信， 一 props downward data flow 副组件通过 props 属性向子组件传递数据，子组件可以通过 props 选项来声明接收这些数据。 这种方式是最常见的父子组建通信方式，适用于父组建向子组建传递静态数据或事件回调函数等。二 event support later for 子组件通过 inb 方法触发自定义事件并传递数据。副组件可以通过 vr 指令来监听这些自定义事件，并通过事件处理函数来获取数据。这种方式适用于子组件向副组件传递数据或事件的情况。三 rap 副组件可以通过 rap 属性给子组件指定一个引用 id， 然后通过 red 属性来获取子组件的实力，从而调用子组件的方法或访问其属性。四 providing jack 副组件通过 profi 选项向所有子组件提供数据或方法。子组件可以通过 inject 选项来注入这些数据或方法。这种方式适用于副组件向多个子组件传递相同的数据或方法。 五 v x 如果应用程序的状态管理比较复杂，建议使用 v x 来管理状态。 vx 是一个专门为 uj 新用程序开发的状态管理库，它提供了一个中央化的状态管理系统， 用于存储应用程序中的所有组建共享的状态。以上是 you j 中父子组建通信的主要方式，开发者可以根据应用场景和需求选择适当的方式进行通信。
15前端sir
13:42查看AI文稿AI文稿大家好，我是学学原地的特别讲师高洛峰。上节课咱们使用 ts 来声明维优 e 的一个组件，那有几个知识点。第一个知识点呢，必须得在我们的脚本这个地方，我们得把语言指定为 ts， 这样的话我们在这个里边脚本里边就支持 ts 这样的一个语法，这是第一个支点。第二个支点就是我们必须得从维优 e 里边引入这个类型， 那他相当于是一个方法，所以呢我们导出组件的时候，所有的代码放到这个方法里边，我们才能让我们的组件 的 gs 支持 ts 这样的一个代码检查。第三个指点就是我们在声明我们数据的时候，再对它里边用到这个数据类型的时候， 我们可以在外边通过类型或者是接口都可以啊定一个数据的格式，然后呢我们再对他里边返回数据，这个阶层格式里边通过断言 的方式让我们这个数据使用这个类型进行限制，这是我们这几个指点， 那这节课呢，我们再来继续学习一下。那除了在我们模板里边使用数据，使用对他里边返回的数据做响应式之外，那我们还有 数据是什么？是一些从副组件传过来的数据，那就是通过属性传过来的，比如说我们现在想需要在副组件里边传一个哈喽的一个属性，你看我们在暑假这里边使用的时候传一个哈喽，然后我们这里边写上 哈喽麦，呃 tcomp， 比如说和这个模板打个招呼，对吧？那这个是字物串的属性，我们传过来的，那我们需要在我们这个里边 怎么的去接收这个属性，我们才能在这个地方使用，那怎么接收呢？我们通常使用的是 props 这个 options 这个选项，我们来指定的，那里边需要指定一个什么？需要一个 hello， 然后我们需要这个属性接收一个哈喽的属性。哈喽属性呢？类型是什么呢？类型是自由串的，类型是自由串的。当然了，我们假如说想让他必须传，必须传这个属性，那我们就是 i q u i r 等于处，这样的话我们就是哈喽属性是必须传的，那这样的话我们传过来这个属性这块我们已经接收了，告诉我们页面里边你可以接收一哈喽的是字物串的属性了。然后呢我们就可以在比如说标题这块，我们给它变了，就可以使用什么哈喽 就可以了，然后我们看一下，你看，呃，在我们后面这块好像没有收到这个标题，我们再看一下啊，哈喽， 对啊，我们没有写错呀，哈喽的属性字物串的必须全值。然后我们在这块使用，哈喽没有提示，我们再保存一下，我们步行刷新一下看一下。好，再刷新一下才能出来。 副组件传过来的啊，他这个页面他自动刷新，但是副组件他没给我们刷新，对吧？咱们传过来整体刷新一下就有了。这个这样的话，我们看一下，这是传哈喽的属性。那如果我们传一个对象属性呢？那传一个对象属性，比如说 我们在这个位置，我们需要，假如说我们没有类型限制的话，我们就可以随便传，对不对？比如说我们传一个标题，那假如说我们传一个对象属性，那我们需要呃 加上这个冒号，对不对？绑定，绑定这个值，那我我们传一个对象，假如说这里边我们加一个微流值， vr ue 啊 啊 vavalue 给他一个值，值是什么呢？嗯，这个是标题，这是 vue 三加 ts 这样的一个标题，然后呢这个标题让他显示一个颜色，比如说卡了，我们给个颜色啊，给他一个红色的 r e、 d 红色的一个颜色，那这样的话我们就传一个对象过去，那传一个对象过去呢？那我们在这个里边肯定是得接收的，得接收的，那同样我们在这块再做一个标题， titl e 标题，那这里边你看类型，如果我们这块加上 object， 这是可以的， 但是呢就限制不了他是一个太大的一个范围，只是告诉我们一个对象类型，对吧？然后这里边我们可以给一个底缝，缺省值，缺省值，返回去，返回的一个什么值呢？我们这块也没有约束，也不知道是什么，对吧？那我们能不能把这个类型要 约束一下呢？当然那有，如果说直接在这块写上一个呃类型，因为他这块指定是一个阶层格式，是一个值，那咱们能不能像这种用断言的方式呢？ 这里边也就在呃 voets 里边给我们另外一个选项，比如说我们这里边加上一个，他是有一个发型的，这样的一个约束， 直接在这里边专门是属性类型的一个发型 pro， 你看属性类型的一个发型， 我们拿过来，他是一个发型啊，那看一下发型怎么用？那比如说我们在这里边定一个类型，也就是要求我们传过来的这个数据，我们得用一个类型进行约束。什么类型呢？比如说标题音否，标题信息，等于 必须得有一个什么，必须得有一个 v 六，然后是自负串的，然后呢必须得有一个颜色是自负串的，我们先加上这样的一个类型，当然了，你也可以声明接口都是可以的，但这我还没没用到，怎么用呢？你看 我们已经导入了这个属性的，也就是参数的类型，对吧？纯参数的时候有这个类型，那传统的类型不需要变化，能用自务串约束的，那就直接自务串就可以了， 直接做事就可以了。那这个类型呢，我们还是约束，我不在这个类型，但是呢，我们这块使用上这个类型作为什么呢？把它断言成这个属性类型，因为他是一个范型，这个范型顶着吊用的时候，这个属性类型由我们吊用者决定 什么类型，那我们可以使用我们的 tittitl e 音否这个类型，这样的话，我们这个对象就断言成我们属性的类型这个类型了，就不仅仅是一个对象，而是也是一个对象。但这个对象呢，得通过我们符合这个格式 对象得符合我们的这个类型的格式才可以。所以呢，既然对象得符合这个类型格式，那我们这里边 你看缺少值，在使用的时候里边必须也得有个 v 六，这点默认的维优 e 三加 type scriptscipt。 然后呢也必须有颜色， 默认的颜色我们就是黑色井号零零零就可以了。然后呢，我们 在使用这个标题的时候，那我们在这个位置这块，我们就可以给他哈喽这个，然后我们后边再给他连接一个标题，连接一个标题， 标题呢就是 titl e 这块标题里边，你看我们使用的这个标题，它是一个对象类型，对吧？是一个对象类型，然后里边得有一个什么微流值， 你看有个微流值，然后呢这块我们再加上一个标题，给他一个颜色，咱们就设置置顶颜色吧，我们使用绑定，绑定一个样式，然后呢让这个里边呃 指定颜色卡了。指定什么颜色呢？是我们的 titl e 里边的卡了，你看他有提示卡了就可以了， 我们保存一下来，再刷新一下，你看这里边红色的颜色，然后呢把我们这个标题也读出来了。这就是我们在使用属性的时候，如果是对象或者是数组，我们可以通过这个类型再去约束一下 这个类型，咱去约束一下啊啊，这里边对他这块有一个呃泛红的，他说这个方法没有重写覆盖，这个不用管啊，不用管，因为我们呃后期使用组合 api 的时候就不用使用他了。嗯，这个商品 啊，未知类型的，不存在这个类型，属于 good， 不存在这个类型，我们这块已经约束这个 类型了啊，正好我们加个 typ， 这没有必要啊，把它去掉，先甭管这些，这是 e s 令他的一个提示啊，不影响我们成运行，我们看一下，刷新一下成运行是没有错的， 看我们打开控制台也没有看到错误啊，这是没关系的，那咱就不用管他。然后呢我们这块是类型的一个约束， 可以通过这种，也就是属性传播的时候，属性是有个发型的，可以这些大的属性，比如数组啊，或者对象啊，对吧？我们可以用这种类型，然后呢通过发型来具体 细化到是什么样的类型，而不是这种大的类型，那除了这些，比如说我们还可以在这里边使用一些计算属性，那计算属性的其实也没有什么变化，比如说我们在这里边在这个位置吧加上一个 comput cumpute d 计算属性，计算属性呢，我们这里边加上一个，比如说我们做一个呃 w 吧，这个数乘以二，对吧？ wm 这个数乘以二的这样的一个属性，然后我们相当于在这里边做一个方法，然后返回这次里边的 num 乘以二，那这个 num 是十乘以二。我们计算属性，那我们用 用的时候在页面里边就可以用到这个计算属性了，比如说我们在最最下边加上这个属性就可以了， 和我们原来使用的也是没什么区别的。这计算属性，那如果我们在这里边想加上事件的话，想加上这事件的话，比如说我们这里边加一个呃按钮， 比如说 button， 这里边来一个佳佳的按钮，佳佳的按钮，然后呢我们这里边来一个 num， 使用这个按用 m， 也就是我们让这个按用 m 加加，对吧？加加，这里边加上一个事件，可利可点击的时候，我们调一个呃 ad nadd 这样的一个方法，当然里边我们可以传递呃 num 这样的值，也可以传递参数，也可以不传递参数啊，我们调用这个方法，那现在呢？这个方法我们我们还没写，我们将所有的方法其实是写在这里边的， methods 是写到这个里面的， 这里边定一个 madd 这样的一个方法，那我们不需要，如果不需要返回值的话， void 就行了。如果需要参数， 如果需要参数的话是什么类型，我们也可以在这里边限制，比如说 index 的或者什么，对吧？这个 number numbi， 那限制类型也都可以这么写。这里边我们是不需要传值的，那比如说我传一个吧，传一个五， 然后在这里边我们就可以让这次点 n u m 加加就可以了， 把这个都去掉啊，因为在 ts 令检查的时候，他不需要分号了， 他也是告诉我这个类型，因为这个我没有类型约束啊，没有用类型约束， 你看实时点击，呃，没有类型这个函数，我看一下， 我们写的是雕的是 n 加加啊，我们这定义了什么？定义错了就定义成 madd 了。 nadd， 我们保存一下，来，我们再看一下啊， 刷新一下，点击，你看加了计算属性也跟着变了，对吧？这就可以了， 这就是我们在各个结构里边如何使用 ts， 如何使用 ts 啊？好，这节课我们先到这里，那下节课我们在组可以 pi 里边使用这样的一个过程。
10:05
10:59查看AI文稿AI文稿各位同学大家好，我们本小姐继续微信小程序的学习啊，在上小姐给大家讲解了路由主见的生命周期啊， 那么这一小节我们来给大家讲解如何创建一般主见啊，我们把这个全部关闭啊，路有主见啊，他实际上你可以把它看成一个容器啊，里面的内容我们都可以把它拆成一般主见啊，所以说我们需要在这个根部下面啊，创建新建一个文件夹， 他叫做 compomens 啊， compon ents 啊，然后如何去创建一般组建呢啊，还是在这新建一个文件夹啊，比如说我们在这叫翘的 啊，一般主见，大家可以把它理解为子主见啊，路由主见一般都是副主见啊，那么今这一节课，我们就重点来讲一般主见 哈，包括复制组件，如何通信哈，然后我们如果新建路由是新建配件啊，如果是新建一般组建的话，我们就新建 ctrlmet 就可以了啊，还是写翘的啊，还是写翘的啊，他会自动帮我们生成 四个文件啊，跟我们路由主见是一样的啊，但是只是说在这个街市里面不一样啊，街市，在路由主见当中的街市，他调用了一个方法叫配节， 而在一般主页当中，他都有一个方法叫 compulment 啊，这个是有所区别的啊，当然啊，它里面的结构也变了啊，这有一个 party 十啊，还有一个 data， 还有个 masses 啊，这个 pope 提示就是什么呢啊，接收啊，副主见的啊，副主见啊，传递过来的啊，数据啊，然后跌他，很简单 啊，这个是组建啊，内部的数据啊，组建内部的数据，还有个 max 啊，啊，组建啊，内部的方法，内部的方法啊， ok， 我们先讲这几个好，然后其他的都一样哈，只是结实的结果不一样，但语法就是一样的。好，我们在这写一个叫翘着的啊，写一个叫翘着的。好，如何在我们的副组建当中去引用这个组建呢？哈，首先回到副组建的因带式的节省当中来哈， 他默认有一个属性叫 uzingcompomens 啊，这是一个空对象啊，里面啊，可以来引用我们的直组建。怎么引用呢？先取一个名字啊，这个名字通常情况下来说，跟你直组建在这创建的这个名字一样，我们这叫跳的啊，这也叫跳的好， 来，直接就写我们的相对路径啊，比如说点点杠啊，再点点杠， ctrlmen 是下面的啊，翘的啊，在下面的翘的啊，学个名字，然后冒号，后面跟你当前组建的路径啊，这样的话，我们就相当于引用和注册了。组建了啊， 那么我们在这取了这个名字哈，实际上就变成了一个 htm 标签了。好，我们把这个注视了啊，他就变成一个翘的标签了。好，我们就可以直接在这写翘的， 如果你这个名字叫 a， 那么他标签就叫 a 啊，如果叫 b 哈，就叫 b 啊，当然不能跟小程序啊，组建内部的标签名重名了，好 好保存，让我们看一下。翘的显示在页面上面。 ok， 翘的就显示在页面上了啊，我们在这再加个一二三， 好，说明我们引用成功了啊。再说一次，在副组建的接受文件当中有一个 u n 卡碰碰词啊，然后在这啊取个名字啊，一般情况下跟你组建名字是一样的，然后后面跟相对路径啊，这样你就引用了组建了啊， 好，我们把这个一二三好给他干掉好，然后如何去传递参数呢？ 把副主见传递给执主见啊，直接在执主见的这个标签里面写啊，比如我们要把内幕传递过去，这个名字也是自己取的啊，一般情况下跟你的数据名是一样的啊，等于啊，引号啊， 在之前的课程当中讲了，只要用到变量啊，就会在这写变量啊，把我们 index 的这个内幕啊，在这啊，我们先把这个关了啊，这个内幕给他传递 过去哈，还有个 number 哈啊，如果传多个空一个啊， number 等于我们 indice 里面的 number 啊，这样就把内幕和 number 都传递过去了啊，直接写属性的方式啊，就传递过来了 啊。那么在翘的的这个结实文件当中怎么去接收呢？看我们刚讲了啊，这个 propetes 就是来接收复制件传过来数据啊，第一个叫内幕啊，把它写成一个对象的形式 啊，第一个太普，太普就是这个数据的类型啊，比如说传奇过来是个实训类型的啊，这个叫 num 啊，他的太普是叫 number 类型的啊，你在这给了类型，在这边就要 跟他类型一致啊，好，没有报错，没有任何问题，那么你在这个 props 里面接收的这个数据 好，就可以直接在这里面来访问了啊，比如说我们把这个删了啊，我是啊，副主见啊，传递啊过来的数据啊，就直接叉子表达是用就可以了啊，一个叫内蒙啊，一个叫 number， 当然这个名字哈，不能跟你对他当中的名字重名了啊，不能跟你组建内部的名字重名了，好啊，这个跟时就传递过来了，比如说我们把这换了哈， 我们把这个内幕换了，换就换成浪浪板哈，那么他的类型就不符合了啊，但是他也没有报错啊，但一般情况下我们在这写了这个太普啊，他没报错啊， 也不知道什么原因好，但一般情况下我们跟这个是一样的啊。好，如果你不传好，不传， 这还可以设置一个叫歪流的属性啊，什么意思呢？就是默认值啊，默认值，如果你在副主见这边传递了这个内幕，那么就会找你传递的这个内幕，如果我们现在把这个内幕给他删除啊，如果你现在没有传，他就会去找你在这设置这个 va 流的默认值 啊，这个在封装主件当中啊，很大用处啊，希望大家了解啊。好，这个是副主见传递给执主见啊，那么执主见的得他跟 message 啊，这个是一样的啊，那么比如说我们在这啊，有一个叫 message 的啊啊，我是啊，执主见的数据 好，现在我们需要把直组件数据又回传给副组件啊，那么怎么做呢啊，我们需要通过分发事件的方式啊，什么叫分发事件呢？ 一般情况下我们会通过一个事件啊，来做分发事件的这个操作啊，我们在这来个巴特啊，传直给啊，副主界啊，我们在这帮的 top 好，比如说叫剩的啊， 那么写过来蜘蛛这样的方法就要写到这个 max 子里面来了啊，就要写在这个 max 子里面来了啊，我们方法名叫剩的啊， 那么怎么样传递给副主见的啊？通过 rs 点啊，叫崔哥一问他的这么一个方法啊，他里面传递两个参数，第一个是叫分发的世界名啊，这个随便自己取啊，叫 a， 叫 b， 叫 c 都可以啊。第二个就是我们 的要传递的数据，比如说瑞士点得他点买手机，好，现在只要我们一点击这个好，我们就能把这个数据传递给付出去啊， 那么在复制件怎么接收呢啊？在这啊，通过棒的啊，棒的什么呢？棒的你在这边发过来的这个事件的名字，如果你的这个类似点吹干英文套。第一个参数叫 a， 那么就棒的 a 啊，如果你叫 b 就棒的 b， 我们现在叫剩的哈，那么就棒的，剩的哈。等于一个方法名字啊，这两个剩的不一样哈，这个方法名是副组建内部的方法名啊，也是随便取名字，一般情况下我们都一样 好，来复制，复制到这来好叫剩的这么一个函数啊，他里面还是有一个叫一的啊，那么我们传递过来的参数在哪呢？ 传递过来的参数在一点哈，一条点班的当中，应该是在这里面哈，我们来看一下啊，一，点击 昂迪赛，好，我们把这个一先打出来吧。来点击好一点 啊，就直接在一点低调里面啊，一点低调里面。记错了，不好意思啊，一点低调里面好，来点击好，我是直组建的数据啊，这样的话你就可以在这个 data 里面来说个字啊，不用， max 是空的啊， 然后在这通过瑞士点 set 对他的方式来 message 叫一点 好。第一条好，在这我们再来显示一个六啊，好，我是好直组建好传递过来的好参数。好，就是我们的这个 message 好好一点击 好，我是自助键的数据就传递过来了啊，这样的话就通过分发事件的方式啊，从自助键把数据传递过来了啊，那么你也可以不通过，比如说点击试卷这种 啊，我们也可以直接在页面加载的时候就显示，那么植树间的生命周期不一样哈。植树间的生命周期都写在哪呢？ 好，都写在一个叫 live times 里面啊，他是一个对象。那么常用的生命周期啊，就是页面加载时啊，出发啊，常用生命周期叫什么呢？就叫瑞迪啊，就叫瑞迪啊，这个有点等同于我们的昂露的啊，这个瑞迪等同于我们昂露的啊， 我们也可以把这个这张代码啊复制到这来，复制到这来啊，那么页面一加载的时候就会把这个数据传递过来 啊，这个是不通过事件的方式啊，直接传递啊，如果你要传递多个啊，你有几种方式？比如说我在这传递一个宿主啊，传递一个宿主啊，这样也可以啊，传递一个宿主啊，就是他一也可以干嘛呢？也可以把这个东西改成对象的形式。 好，如果你传递多个哈，如果传递多个哈，比如说这叫 message 啊，然后第二个属性哈，就是你第二个参数，比如我们这传个 number 是一啊，十万啊，传递过来看到没有，他就说我不借给他，我不借给他啊，但这一边是显示是这个，但是我们在这已经打印出来了啊， 这个是传递多个的方式啊，传递多个的方式啊，如果传递一个就直接在后面写就可以了啊，好了，本小姐就给大家讲解了啊，直组建 啊，如何创建啊，包括他里面的属性啊，包括父子组建，如何通信啊？好，本小姐就给大家讲到这里，谢谢大家。
196课得在线
