vue组件插槽的使用

vue 插槽

一个按钮组件，外部提供按钮类型和按钮名称，名称通过插槽 slot提供

components: {
	myButton: {
		props: ['type', 'content'],
		template: '<button class="my-button" :class="type" ><slot></slot></button>'
	}
}

外部调用

<my-button type="success">成功按钮</my-button>

插入到指定位置

给slot取个名字

<slot name="xxx"></slot>  

具名插槽的使用

<template v-slot:xxx></template>

v-slot的简写

<template #xxx></tempalte>

🚬每天分享一点点， 欢迎大家讨论， 共同学习， 有不对的地方，欢迎指出🚬