基本用法 (vue2):
<template>
<div
v-bind="$attrs"
v-on="$listeners"
>
<template v-for="(index, name) in $slots" v-slot:[name]="data">
<slot :name="name" v-bind="data" />
</template>
</div>
</template>
需要添加别的属性:
<template>
<div
v-bind="$attrs"
v-on="$listeners"
:style="{ color: color }"
>
<slot></slot>
</div>
</template>
<script>
export default{
name: "test",
props: {
color: String
},
}
</script>
基本用法 (vue3):
Vue3中将
$listener
删除了,统一使用$attrs
.
<template>
<div v-bind="$attrs" >
<template v-for="(obj, name) in $slots" v-slot:[name]="data">
<slot :name="name" v-bind="data" />
</template>
</div>
</template>