vue 使用 elemen UI 导航菜单所遇到的问题

我们常常在开发vue 项目中使用 elemen UI 开结合开发，但在单页面应用中，随着用户的操作而改变的状态，我们常常使用 VueX 来做状态管理，但是，如果用户刷新页面，之前的状态都会消失，那么，导航该如何准确给当前页面的导航按钮添加选中的样式呢？

直接上代码

<template>
  <el-menu router mode="horizontal" @select="selectMenu">
    <template v-for="(item,index) in navlist">
      <el-menu-item :index="item.path" :key="index" disabled>{{item.name}}</el-menu-item>
    </template>
  </el-menu>
</template>

这样写的问题是，当用户刷新页面时，当前页面对应的导航并不会被添加选中样式，那该怎么办呢？

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

当我们这样写，将当前路径时时绑定到导航上，就可以完美实现了.