插槽//App组件templatediv id='app'Testdivslot插槽占位符/div/test/div/templatescriptimporttestfrom ' @ test export default { components : { test }/script//test组件templatediv id='test'//定义插槽slot/sloth3这是test组件。app.vuetemplatedivid=' app ' testdiv slot=' header '这是头部/divdiv slot='footer '这是尾部/div/test/div/template sste script//test.vuetemplatedivid=' test ' slot name=' header '/sloth 3这是test。template v-slot//app.vuetemplatedivid=' app ' testtemplatev-slot=header H2 slot头部内容/h2/templatep直接插入组件内容/ptemplatev templatev export default { components : { test }/script//test.vuetemplatedivid=' test ' headerslotname=' header '/slot Sect
描述组件模板所需的slot插槽，并将当前组件的数据通过v-bind绑定到slot标记。
使用组件时，slot-scope=“scope "用于接收绑定到组件中的slot标记的数据。
您现在可以在scope.xxx中使用绑定数据
//app.vue divid=' app ' test//slot-scope作用域插槽div slot=' default ' slot-scope=' scope ' { { scope.msg } } /
divid=' app ' testtemplatev-slot : header=' scope '/v-slot定义作用域插槽div H3 slot/h3p { { scope.msg } }/p/div/v