如何让面包屑（Breadcrumb）只单独显示最后的路由

您可以在路由中设置breadcrumb属性，将其设置为true以启用面包屑导航，并使用v-slot：item自定义每个面包屑项的呈现方式。然后，只需在模板中访问最后一个面包屑项即可。例如：

<template>
  <div>
    <b-breadcrumb :items="items">
      <template v-slot:item="{ item }">
        <span v-if="item.text !== lastRoute">{{ item.text }}</span>
        <strong v-else>{{ item.text }}</strong>
      </template>
    </b-breadcrumb>
  </div>
</template>

<script>
export default {
  data() {
    return {
      items: [
        { text: 'Home', to: '/' },
        { text: 'Products', to: '/products' },
        { text: 'Shoes', to: '/shoes' },
        { text: 'Running Shoes', to: '/running-shoes' },
      ]
    }
  },
  computed: {
    lastRoute() {
      return this.items[this.items.length - 1].text
    }
  }
}
</script>

在此示例中，lastRoute计算属性返回最后一个面包屑项的文本。在v-slot：item中，我们检查当前面包屑项是否是最后一个。如果不是，则使用普通文本呈现。如果是，则使用加粗文本呈现。

改造前：

 改造后：