element ui el-menu组件侧边栏选中效果

<el-menu
    :default-active="defaultActive"//重点
    :collapse="!store.appStore.sidebarOpened"
    :unique-opened="store.appStore.theme.uniqueOpened"
    background-color="transparent"
    :collapse-transition="false"
    mode="vertical"
    router
    >
    <template v-for="menu in store.routerStore.menuRoutes"  :key="menu.path">
     <menu-item v-if="!menu.meta.hidden"  :menu="menu"></menu-item>
    </template>			
</el-menu>
<script setup>
import store from '@/store'
import MenuItem from './MenuItem.vue'
import { useRoute } from 'vue-router'
import { computed } from 'vue'
const route = useRoute()
const defaultActive = computed(() => {
const { path } = route
 if(route.meta.rewritePath){
    return route.meta.rewritePath
    }else{
    return path
    }
})
</script>
router.js文件
import { createRouter, createWebHashHistory } from 'vue-router'
const routes = [
{
	path: '/',
	component: () => import('../pages/HelloWorld'),
	meta: {
		title: '首页',
		show: true
	}
},
 {
    path: '/work/list',
    name: 'workList',
    component: () => import('../pages/work/list.vue'),
    meta: {
      title: '重点工作',
      show: true,
    }
  },
{
	path: '/work/add',
	name: 'workAdd',
	component: () => import('../pages/work/add.vue'),
	meta: {
		title: '重点工作-新增',
		show: false,
		rewritePath: '/work/list',//根据这个来判断高亮在哪个父级菜单
	}
},
]
const router = createRouter({
	history: createWebHashHistory(),
	routes
})
// router.afterEach((to, from) => {
//
// })

export default router