超级简单，直接上代码
在路由中配置mete：
{ path: '/user', meta: { title: '用户中心' }, component: resolve => require(['@/components/page/user'], resolve) } // 配置meta
组件内容：
<template>
<el-breadcrumb separator="/">
<el-breadcrumb-item>当前位置:</el-breadcrumb-item>
<el-breadcrumb-item v-for="(item,index) in titleList" :key="index">
<router-link :to="item.redirect||item.path">{{item.meta.title}}</router-link>
</el-breadcrumb-item>
</el-breadcrumb>
</template>
<script>
export default {
data() {
return {}
},
computed: {
titleList() {
return (this.$route && this.$route.matched) || [] // 将matched数组返回出去 或者 返回空数组
}
}
}
</script>
- this.$route.meta.title 当前页面title
- this.$toute.matched.meta.title 当前目录+重定向页面的title
