路由的优先级

在我们的路由规则中，如果有某个路径，有多条规则可以与之匹配，那么，哪个规则先定义了，那就就生效。

使用*进行模糊匹配

      {
        path: '/user-*',
        component: c1
      },

当我们访问的路径是以user-开头的，都可以访问:

/user-
/user-1234
/user-13241234/12342134/124/1234

地址上的参数params

通过在规则中定义要接受的参数名:参数名

 {
        path: '/b/:channel/:id',
        component: c1
      },

这个定义，表示我们要接收channel和id两个地址参数。

/b/xxx/11             channel:xxx  id:11
/b/123412341234/11    channel:123412341234  id:11
/b/123412341234       匹配不到
/b/123412341234/      匹配不到

我们接收到的数据，会由路由帮我们加入组件实例的$route对象内，放在params属性中。

c1组件中我们将接收的数据显示出来

<template>
    <div>c1
        <p>channel：{{$route.params.channel}}</p>
         <p>id：{{$route.params.id}}</p>
    </div>
</template>

$route中记录着路由当前的状态数据。

地址上的查询字符串

要接收查询字符串，我们不需要加额外的代码。

直接从$route.query就可以取到了，比如地址上有?page=1

<p>page：{{$route.query.page}}</p>

练习：使用路由，制作一个聊天室的登录程序。

/login：登录，一个输入框，聊天昵称。输入完毕后点击进入聊天室,跳转到聊天室界面。 /chat:聊天室，显示欢迎xxx

昵称的传递使用params参数