vue2 三级路由面包屑导航

xuhang139

已于 2023-05-24 18:00:50 修改

阅读量532

点赞数

文章标签： javascript 前端 vue.js

于 2023-05-24 17:56:34 首次发布

本文链接：https://blog.youkuaiyun.com/xuhang139/article/details/130852204

版权

routerView.vue文件用于三级页面跳转

<el-breadcrumb separator-class="el-icon-arrow-right">
            <el-breadcrumb-item v-for="item in breList" :key="item.path" :to="{ path: item.path }"><i v-if="item.meta.title=='首页'" class="el-icon-s-home"></i>{{item.meta.title=='首页'" class="el-icon-s-home"></i>{{item.meta.title}}</el-breadcrumb-item>
</el-breadcrumb>
<router-view></router-view>

'$route':{
                deep:true,
                immediate:true,
                handler(n,o){
                    // this.breList = [...n.matched]
                    this.breList = []
                    n.matched.forEach(item=>{
                        if(!item.parent || item.parent.redirect != n.path){                                
                            this.breList.push(item)
                        }
                }
}

router.js文件