vue slot插槽
Posted boye666
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue slot插槽相关的知识,希望对你有一定的参考价值。
如果一个组件内没有包含一个
父级模板里的所有内容都是在父级作用域中编译的;子模板里的所有内容都是在子作用域中编译的。
如果想插入多个不同的slot到指定的位置,可以为每个插槽指定一个名字:如下所示
注:一个不带 name 的
然后使用v-slot指令,可以具体内容插入到指定的插槽:如下所示
Here might be a page title
A paragraph for the main content.
And another one.
Here‘s some contact info
而没有带v-slot指令的内容会被插入到默认的位置。
注意 v-slot 只能添加在 上 ,只有一种例外情况:当被提供的内容只有默认插槽时,如下:
{{ slotProps.user.firstName }}
可以变成:
{{ slotProps.user.firstName }}
v-slot:header 可以缩写为 #header,该缩写只在其有参数的时候才可用,即v-slot:default=" "不可写成#=" ",但可以写成#default=“ ”
以上是关于vue slot插槽的主要内容,如果未能解决你的问题,请参考以下文章