yanbolan
文章282
標籤199
類別26
To avoid scope ambiguity, the default slot should also use <template> syntax when there are other na

To avoid scope ambiguity, the default slot should also use <template> syntax when there are other na

### 具名插槽
https://cn.vuejs.org/v2/guide/components-slots.html

1
2
3
4
5
6
7
8
9
10
11
12
<base-layout>
<template v-slot:header> // slot="" 已经废弃 。!!!!
<h1>Here might be a page title</h1>
</template>

<p>A paragraph for the main content.</p>
<p>And another one.</p>

<template v-slot:footer>
<p>Here's some contact info</p>
</template>
</base-layout>

==base-layout 是一个子组件。内容如下:

1
2
3
4
5
6
7
8
9
10
11
<div class="container">
<header>
<slot name="header"></slot> // 当有多个slot 并且name 时 上面的就要写多个tempelte 了
</header>
<main>
<slot></slot>
</main>
<footer>
<slot name="footer"></slot>
</footer>
</div>

博主:yanbolan
文章連結:https://yuris.site/2020/10_04_60c33bd2.html
版权声明:本文采用 CC BY-NC-SA 3.0 CN 协议进行许可
×