实现一个面包屑的路由选项

<div class="breadcrumb">
       
       <el-breadcrumb separator="/">
       
        <el-breadcrumb-item  :to="{ path: '/' }">首页</el-breadcrumb-item>
     
        <el-breadcrumb-item 
           v-for="(item,index) in  this.$router.currentRoute.matched.filter((ft,index)=>index>0)" :key="index"
        :to="item.path">{
    
    {
    
    item.meta.name}}</el-breadcrumb-item>
      </el-breadcrumb>
      </div>

样式:

.breadcrumb{
    
    
  margin: 20px;
  background: #fff;
  padding: 10px;
}

效果图:

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/weixin_45932157/article/details/124515884