参考如下:

https://element.eleme.io/#/zh-CN/component/menu

先直接遍历路由列表,显示需要显示的导航元素。

    <el-menu :default-active="$route.path" mode="horizontal" @select="handleSelect">
    <template v-for="(item,index) in this.$router.options.routes">
      <el-menu-item :index="item.path" :key="index" >{{item.name}}</el-menu-item>
    </template>
    </el-menu>
@select="handleSelect"

设置选择的方法

    handleSelect (key, keyPath) {
      console.log(key, keyPath)
      this.$router.push(key)
    }

选择方法直接跳转到指定的路由

效果如下:

Vue之ElementUI导航菜单_Vue