第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機(jī)立即綁定

vue學(xué)習(xí)記錄三(插槽、動態(tài)組件、v-once指令)

標(biāo)簽:
Vue.js

一、插槽默认是全部solt内容,具名插槽对应具体的solt,都可以设置默认值 ,使用插槽能够解决父级向组件传递内容(包括hmtl格式)问题。

多个插槽可以通过起名来进行区分: 

1、在使用时通过 slot="name"来定义插槽名 

2、在模板中通过 name="name" 来引用匹配名字的插槽

如:

https://img1.sycdn.imooc.com//5b699c0300011cf015280900.jpg

页面渲染为:

https://img1.sycdn.imooc.com//5b699c960001c9b901860074.jpg


二、作用域插槽:

使用场景-----当子组件作循环或某一部分dom结构由外部传递进来的时候。子组件可向父组件传数据,父组件通过slot-scope来接收传过来的数据。

如:

https://img1.sycdn.imooc.com//5b699f4a00015bc705230391.jpg

父组件从子组件接收的信息都放在props里,并告诉子组件以h1的形式展示


结果渲染为:

1

2

3

4


三、动态组件

https://img1.sycdn.imooc.com//5b69a4020001b06205560274.jpg

https://img1.sycdn.imooc.com//5b69a3ea00013c6404940203.jpg

模板内容可改为:

<component :is="type"></component>


加入v-once指令:template:'<div v-once>child-one</div>'

點(diǎn)擊查看更多內(nèi)容
1人點(diǎn)贊

若覺得本文不錯,就分享一下吧!

評論

作者其他優(yōu)質(zhì)文章

正在加載中
感謝您的支持,我會繼續(xù)努力的~
掃碼打賞,你說多少就多少
贊賞金額會直接到老師賬戶
支付方式
打開微信掃一掃,即可進(jìn)行掃碼打賞哦
今天注冊有機(jī)會得

100積分直接送

付費(fèi)專欄免費(fèi)學(xué)

大額優(yōu)惠券免費(fèi)領(lǐng)

立即參與 放棄機(jī)會
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號

舉報

0/150
提交
取消