vue+element 点击页面内跳转按钮 导航菜单选中

Posted aknife

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue+element 点击页面内跳转按钮 导航菜单选中相关的知识,希望对你有一定的参考价值。

<template> 
  <el-menu 
    router
    theme="dark"
    :default-active="activeIndex"
    class="el-menu-demo"
    active-text-color="rgb(250,83,83)"
    mode="horizontal"
    @select="handleSelect"
  >
    <el-menu-item index="/">首页</el-menu-item> 
    <el-menu-item index="/Material"  >我要找</el-menu-item>
    <el-menu-item index="/Workbench" >工作台</el-menu-item>
  </el-menu> 
</template>
<script>
export default {
  data() {
    return {
      activeIndex: this.$route.path
    };
  },

  watch:{
    $route(to,from){
      this.activeIndex=to.path
    }
  },
  mounted(){

  },
  methods: { 
    handleSelect(key, keyPath) {
    }
  }
};
</script>

 

以上是关于vue+element 点击页面内跳转按钮 导航菜单选中的主要内容,如果未能解决你的问题,请参考以下文章

vue+Element左树导航右内容区页面跳转

element ui+vue实现导航栏菜单以及页面跳转

Vue.js2.0+Element UI里页面导航跳转

elementui导航菜单通过路由跳转怎么活跃状态

(尚044) vue编程式路由导航

vue点击按钮跳转页面(带参数)