VueRouter Props

就是可以通过 props 把路由参数 传递进 对应组件 而不必用$route.params去拿到参数

路由规则

      {
        path: 'message/:id',
        name: "message",
        component: Message,
        props: true
      }

Mssage组件 HTML

 <div>
    message
    <div>这是通过路由开启props拿到的参数：{{id}}</div>
 <div>

组件实例

export default {
  name: "Message",
  props: ['id']
}

注意点：如果一个路由要渲染多个路由一定要分别为每个组件开启路由，像这样

这里涉及到 一个 命名router-view的知识点 如果有name为a b的router-view标签，那么DemoA,

DemoB组件会被渲染到对应位置

      {
        path: 'message/:id',
        name: "message",
        components: {
          default: Message,
          a: DemoA,
          b: DemoB
        },
        props: {
          default: true,
          a: true,
          b: false
        }
      }