vue3.2/Vite/Ts31: 面包屑导航动态展示

<template>
  <!-- ... -->
  <el-breadcrumb separator="ArrowRight">
    <el-breadcrumb-item
      v-for="(item, index) in $route.matched"
      :key="index"
      v-show="item.meta.title"
      :to="item.path"
    >
      <el-icon>
        <component :is="item.meta.icon"></component>
      </el-icon>
      <span>{{ item.mate.title }}</span>
    </el-breadcrumb-item>
  </el-breadcrumb>
</template>
<script setup lang="ts">
  // 获取路由对象
  import { useRoute } from "vue-router";
  let $route = useRoute();
</script>

// src / router / routes.ts
//...
{
    path: '/',
    component: () => import('@/layout/index.vue'),
    meta: {
        title: '',
        hidden: false,
        icon: ''
    },
    redirect: '/home',
    children: [
        // ...
    ]
}
//...