首先先用el-tag搭好架子
<template>
<div class="tags">
<!-- tags标签页 -->
<el-tag
:key="tag.name"
v-for="(tag,index) in tags"
:closable="tag.name !== 'home'"
:disable-transitions="false"
@close="handleClose(tag, index)"
@click="changeMenu(tag)"
:effect="$route.name === tag.name ? 'dark' : 'plain'"
>{
{ tag.title }}</el-tag>
</div>
</template>
tags的获取主要是通过vuex进行维护
let tags: ComputedRef<any> = computed(() => {
return store.state.tagView.tags
})
在关闭tag的关闭方法就是判断关闭的页面是否为当前浏览的页面如果不是就直接commit到store去进行删除,如果是当前浏览的页面就跳转页面到附近tag的页面,并且commit到store删除tag
function handl