在组件的封装中,我们常常希望组件的复用性更多,这就用到了slot语法,常用的slot语法
1.普通用法
子组件
<slot></slot>
父组件在对应位置写标签
2.利用slot语法获取子组件的值
子组件
<slot name="items" :content='modelContent.data'></slot>
父组件
<template #items='{content}'></template>
接收到子组件传来的值,做不同的渲染构成组件的差异化。
3.利用具名slot实现多处slot语法
子组件
<slot name="item1"></slot>
<slot></slot>
<slot name="item2"></slot>
父组件
<template #item1></template>
<p>11111</p>
<p>22222</p>
<template #item2></template>