parent
e9cb257741
commit
0e5454378a
8 changed files with 190 additions and 45 deletions
@ -0,0 +1,64 @@ |
|||||||
|
<template> |
||||||
|
<!-- 面包屑 --> |
||||||
|
<div class="breadcrumb"> |
||||||
|
<el-breadcrumb separator=">"> |
||||||
|
<template v-for="(item, index) in pages"> |
||||||
|
<el-breadcrumb-item |
||||||
|
v-if="index != pages.length - 1" |
||||||
|
:key="index" |
||||||
|
:to="{ path: route, query }"> |
||||||
|
{{item}} |
||||||
|
</el-breadcrumb-item> |
||||||
|
<el-breadcrumb-item |
||||||
|
v-else |
||||||
|
:key="index"> |
||||||
|
{{item}} |
||||||
|
</el-breadcrumb-item> |
||||||
|
</template> |
||||||
|
</el-breadcrumb> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
props: { |
||||||
|
data: { |
||||||
|
type: String, |
||||||
|
required: true |
||||||
|
}, |
||||||
|
route: { |
||||||
|
type: String, |
||||||
|
default: 'list' |
||||||
|
}, |
||||||
|
query: { |
||||||
|
type: Object |
||||||
|
} |
||||||
|
}, |
||||||
|
data() { |
||||||
|
return { |
||||||
|
pages: this.data.split('/') |
||||||
|
}; |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
update(data){ |
||||||
|
this.pages = data.split('/') |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
<style lang="scss" scoped> |
||||||
|
.breadcrumb { |
||||||
|
margin: 4px 0 16px; |
||||||
|
/deep/.el-breadcrumb__item { |
||||||
|
.is-link, .el-breadcrumb__separator { |
||||||
|
font-weight: 400; |
||||||
|
color: #007EFF; |
||||||
|
} |
||||||
|
&:last-child { |
||||||
|
.is-link { |
||||||
|
color: #0B1D30; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
Loading…
Reference in new issue