标签:microsoft 分发 语法 template world span 全选 作用 作用域
插槽语法是Vue实现的内容分发API,用于复合组件开发,该技术在通用组件库开发用有大量应用
Vue 2.6.0 之后采用全选 v-slot 语法取代之前的 slot slot-scope
1、匿名插槽
// parent <HelloWorld> abcabcabcbabc </HelloWorld> // child <slot></slot>
2、具名插槽:将内容分发到子组件指定的位置
// parent <HelloWorld> <template v-slot:default>abcabcabcbabc</template> <template v-slot:content>具名插槽</template> </HelloWorld> // child <slot></slot> <slot name="content"></slot>
3、作用域插槽,子组件可以自行展示内容// parent
<HelloWorld> <template v-slot:content="slotProps">{{slotProps.dong}}</template>
</HelloWorld> // child <slot name="content" dong="dong~~~~~~"></slot>
可以进行对象的解构写法
<HelloWorld>
<template v-slot:content="{dong}">{{dong}}</template>
</HelloWorld>
标签:microsoft 分发 语法 template world span 全选 作用 作用域
原文地址:https://www.cnblogs.com/haishen/p/11277727.html