插槽語法是vue實(shí)現(xiàn)的內(nèi)容分發(fā)API羽戒，用于符合組件開發(fā)虎韵。該技術(shù)在通用組件庫(kù)開發(fā)中有大量應(yīng)用。
1.匿名插槽
子組件
<div>
<slot></slot>
</div>
父組件
<comp>hello</comp>
2.具名插槽
將內(nèi)容分發(fā)到子組件指定位置
子組件
<div>
<slot name="content"></slot>
</div>
父組件
<comp>
<template v-slot:content>具名內(nèi)容</template>
</comp>
3.作用域插槽
分發(fā)內(nèi)容要用到子組件中的數(shù)據(jù)
子組件
<div>
<slot :foo="foo"></slot>
</div>
父組件
<comp>
<!-- 把v-slot的值指定為作用域上下文對(duì)象 -->
<template v-slot:default="slotProps"></template>
//來自子組件數(shù)據(jù)：{{slotprops.foo}}
</comp>
