vue 页面刷新，导航选中保持不变

最新推荐文章于 2024-04-29 10:42:46 发布

zard千叶

最新推荐文章于 2024-04-29 10:42:46 发布

阅读量1.2k

点赞数

文章标签： vue.js elementui javascript

本文链接：https://blog.csdn.net/weixin_53607113/article/details/125865145

版权

<template>
    <div id="app">
         <el-menu v-if="seen" :default-active="activeIndex" class="el-menu-demo" menu-trigger="click"
                    text-color="#333" router mode="horizontal">
                    <el-menu-item index="/">首页</el-menu-item>
        </el-menu> 
    </div>
</template>

<script>
export default {
    name: "Layout",
    data() {
        return {
            activeIndex: '/',
        };
    },
    watch: {
        $route() {
            this.setCurrentRoute()
        }
    },
    methods: {
        setCurrentRoute() {
            this.activeIndex = this.$route.path;    //监听到当前路由状态并激活当前菜单
        },
    },
    created() {
        this.setCurrentRoute()
    }
}
</script>