vue.js - Vuetify 面包屑作用域插槽

Question

我正在尝试将面包屑合并到我的 vuetify 应用程序中，但这是我的代码:

<v-breadcrumbs divider=">">
    <v-breadcrumbs-item
        v-for="breadcrumb in breadcrumbs"
        exact
        :to="breadcrumb.to">
        {{ breadcrumb.text }}
    </v-breadcrumbs-item>
</v-breadcrumbs>

然后我在控制台中收到此警告。我不太确定这是什么意思..

default slot' is deprecated, use ':items and scoped slot "item"' instead

如果我尝试使用 vuetify 文档中的默认模板:<v-breadcrumbs :items="items">它只允许 href不是:to这正是我需要的。

谁能帮帮我。

Answer 1

似乎 Veutify 现在提供了一个 item 作用域插槽，可用于自定义面包屑。查看他们的示例 here我认为你需要做的是以下..

<v-breadcrumbs :items="breadcrumbs" divider=">">
    <v-breadcrumbs-item
        slot="item"
        slot-scope="{ item }"
        exact
        :to="item.to">
        {{ item.text }}
    </v-breadcrumbs-item>
</v-breadcrumbs>