【vue】点击导航菜单切换局部页面，打开展示默认栏目，页面刷新等问题

 非专业前端，局限性较高，有些问题看起来很小，但是初次接触很棘手，需要查找很多博客，内容也很杂。以下只是过程中总结下来的，要解决的就是标题中的三个问题。

这是我需要达成的效果。

1.第一个是进入导航菜单切换局部页面。

(1)在index.js中配置路由的时候作为导航页的子级。

(2)vue页面，他会根据当前地址栏的路径在这个组件的位置上给你展示

相应的局部页面。

2.完成1之后，我们可以看到这个页面的基本结构如下图。

需要继续解决一些问题，问题一，进入页面的时候默认展示“订阅管理”这个子级的内容。问题二，在刷新的时候，选中的菜单不会改变（不会丢失）。

对于问题一，重定向。也就是在进入该页面之前重定向到某个子级。

第二个问题，刷新之后保持不变，就是让activeIndex始终指向当前地址栏这个路径。

3.贴代码

index.js:

export default new Router({
  routes: [
    {
      path: '/',
      redirect: '/login'
    },
    {
      path: '/login',
      name: 'login',
      component: Login
    },
    {
      path: '/menu',
      component: Menu,
      redirect: '/paper',
      children: [
        {
          path: '/paper',
          component: Paper
        },
        {
          path: '/user',
          component: User
        },
        {
          path: '/order',
          component: MyOrder
        }
      ]
    }
  ]
})

menu页面: