[Vue]动态路由

ebook/index.js:

router/index.js:

  {
    path: '/ebook',
    component: () => import('../views/ebook/index'),
    children: [
      {
        path: ':fileName', // 动态路由,动态路径参数以冒号开头
        component: () => import('../components/ebook/EbookReader')
      }
    ]
  }

EbookReader.js:

{{$route.params.fileName}}

注意是$route不是$router

浏览器访问：

aaa赋给了:fileName，EbookReader.vue组件通过{{$router.params.fileName}}取到并渲染到了页面中