插槽slot
Posted Lighter_Studio
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了插槽slot相关的知识,希望对你有一定的参考价值。
主要是让组件的可扩展性更强。
1.匿名slot使用
//定义组件my-component <div class="myComponent"> <slot></slot> </div> //使用方法 <my-component> <p>我就是slot的替代内容,这里可以放任何标签元素,即使是一长串ul>li列表</p> </my-component>
2.具名slot使用
//定义组件my-component <div class="myComponent"> <slot name="mySlot"></slot> </div> //使用方法 <my-component> <p slot="mySlot">我就是这个叫mySlot的slot替代内容,这里可以放任何标签元素,即使是一长串ul>li列表,但是我是一个有名字的宝宝,所以你必须给我加上slot="mySlot",不然我就报错给你看!</p> </my-component>
如果不在有slot的组件里加入任何标签,slot什么都不会显示的。
-----完-----
以上是关于插槽slot的主要内容,如果未能解决你的问题,请参考以下文章