vue-slot插槽

it2024-11-13  11

插入的是标签

要父组件在子组件中插入内容 ,必须要在子组件中声明slot 标签  ,如果子组件模板不包含<slot>插口,父组件的内容<p>{{msg}}</p>将会被丢弃。

 当slot存在默认值<slot><p>默认值</p></slot>,且父元素在<slotshow></slotshow>中没有要插入的内容时,会显示<p>默认值</p>(p标签会去掉),当slot存在默认值,且父元素在<child>中存在要插入的内容时,则显示父组件中设置的值,

slotshow:是子组件  如果有多个slot就得声明一个name

子组件中

<slot name="num1"></slot>

<slot name="num2"></slot>

父组件中

<slotshow slot ="num1"></slotshow>

<slotshow slot ="num2"></slotshow>

 

最新回复(0)