Vue-router 的使用思考

1、关于 router-view 匹配

vue 项目使用 vue-router，所有的根级别的路由都是在 App.vue 文件中的 router-view 中渲染的。比如下面的 path: '/' 、path: '/home' 路径匹配到的组件都是在 App.vue 文件下的 router-view 中进行渲染。

其他级别的路径在对应的父组件的 router-view 中进行渲染。

// App.vue 
<div id="app">
    <router-view/>
</div>

// 路由文件
routes: [
    {
      path: '/',
      name: 'HelloWorld',
      component: HelloWorld,
      children: [
        {
          path: 'item01',
          name: 'Item01',
          component: Item01
        }
      ]
    },
    {
      path: '/home',
      name: 'Home',
      component: Home
    }
]

 2、meta 元信息的妙用

路由可以配置 meta 选项来备注路由的一些信息，利用这个元信息可以实现一些比较巧妙的功能。可以参考：https://www.bbsmax.com/A/A7zglW41J4/

 

来源：https://www.cnblogs.com/wenxuehai/p/11359180.html