You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
duoji-frontend/src/layouts/Breadcrumb.vue

53 lines
1.3 KiB
Vue

<template>
<a-breadcrumb class="breadcrumb">
<a-breadcrumb-item v-for="(item, index) in breadList" :key="item.name">
<router-link
v-if="item.name != name && index != 1"
:to="{ path: item.path === '' ? '/' : item.path }"
>{{ item.meta.name }}</router-link>
<span v-else>{{ item.meta.name }}</span>
</a-breadcrumb-item>
</a-breadcrumb>
</template>
<script type="text/javascript">
export default {
name: "Breadcrumb",
data () {
return {
name: '',
breadList: []
}
},
created () {
this.getBreadcrumb()
},
methods: {
getBreadcrumb () {
this.breadList = []
// this.breadList.push({name: 'index', path: '/dashboard/', meta: {title: ''}})
this.name = this.$route.name
console.log(this.$route.matched)
this.$route.matched.forEach(item => {
// item.name !== 'index' && this.breadList.push(item)
this.breadList.push(item)
})
}
},
watch: {
$route () {
this.getBreadcrumb()
}
}
}
</script>
<style scoped>
.breadcrumb{
background: #ffffff;
padding: 20px;
margin-top: 64px;
}
</style>