Skip to content

布局的插槽语法糖

某些布局可以使用 Vue 的具名插槽提供多个内容插入点。

例如,在 two-cols 布局中,你可以并排显示左侧(default 插槽)和右侧(right 插槽)两列。

md
---
layout: two-cols
---

<template v-slot:default>

# 左侧

这显示在左侧

</template>
<template v-slot:right>

# 右侧

这显示在右侧

</template>

左侧

这显示在左侧

右侧

这显示在右侧

我们还提供了插槽名称的简写语法糖 ::name::。以下与前面的示例完全相同。

md
---
layout: two-cols
---

# 左侧

这显示在左侧

::right::

# 右侧

这显示在右侧

你也可以明确指定默认插槽并以自定义顺序提供。

md
---
layout: two-cols
---

::right::

# 右侧

这显示在右侧

::default::

# 左侧

这显示在左侧

Released under the MIT License.