一、场景：在页面刷新后，仍然定位到之前菜单栏选中的按钮，即之前的菜单栏按钮仍为激活状态，而非重新定位到第一个默认激活状态的菜单栏按钮。
二、1、在element-ui组件库中，有一个名字为NavMenu导航菜单的组件，<el-menu>标签上有一个属性default-active，其值表明当前激活的菜单按钮对应的组件路由，也可以去掉这个属性，但刷新页面后菜单栏激活的按钮变为第一个，加上这个属性后页面刷新后仍然是之前的菜单按钮为高亮状态。
2、菜单栏的按钮很多，所以default-active的值不是静态的，这里给一个js对象，逻辑里给这个对象动态赋值为当前组件的路由，即每次刷新页面后默认激活的按钮对应的仍是当前路由对应的组件。
3、default-active=“activeMenu” // 名字可以随便取
4、data () { // 页面的初始化数据
return {
activeMenu: '/home/index', // 值为首页组件路由，这里是固定的，当路由发生变化时，要改变activeMenu的值为当前路由。
}
},
5、watch: { // 路由监听：监听路由的变化，从而做出相应操作
$route: {
immediate: true, // 一旦监听到路由的变化立即执行
handler(to,from) { // 回调函数，两个参数，to：当前的组件，from：上一个组件
this.activeMenu = to.path // 给activeMenu重新赋值为当前组件的路由地址
}
}
}
三、路由基础回顾：
1、route：它是一条路由，根据不同的地址展示不同的内容
2、routes：它是一组路由
3、router：是一个机制，它来管理路由