路由规则
Rap 支持history,hash两种路由方式
Rap 的路由是 Rap的核心功能之一,Rap 秉承着**约定大于配置**,Rap 的路由不需要配置大量的路由对应关系,Rap 使用的是路径查找的方式
### history模式
```
router_model: 'history',//路由模式 history 和 hash
history_base: 'mobile',//路由是 history 时的路径前缀
```
对应的路径 为 /mobile/a/b?参数
后端程序员需要将所有 /mobile开头的路径统一返回统一页面 还有页面里不能使用相对路径
### hash 模式
hash模式相对简单
```
router_model: 'hash',//路由模式 history 和 hash
```
对应的路径 为 #/a/b?参数
>[info] 路径 #/forum/user/add 对应的 history模式为 /mobile/forum/user/add
### 路径查找
* * * * *
如路径地址为
> #/forum/user/add
对应到的组件文件 就是 /forum/user/add.html
>[info] 每个组件我们都在 data 下预定义了router变量
>可通过 this.router进行访问
### 参数:query
* * * * *
?后面的参数我们称为query
> #forum/user/list?type=1&&sort=create_time
this.router.query,结构为json对象
~~~
{
type:1,
sort:'create_time'
}
~~~
### 参数:search
* * * * *
路劲中的`数字和@开头`的 在路由查找时会被提取出来作为search
如下面两个路径:
> #forum/user/5/edit
>#forum/user/@tengzhinei/edit
上面的两个路径对应的组件是 `/forum/user/edit.html`
提取的search为`数组`
值在 this.router.search,结构为json对象
~~~
[5]
~~~
路径中可以包含多个参数
> #forum/user/2/1/edit/3
提取的search 为 [2,1,3]
### init 生命周期
* * * * *
我们为组件加入了新的生命周期init
init 会在每次路径变化时调用(包括第一次),这样可以监控路径的变化
每次都会传入query和search两个变量
~~~
<script>
Rap.define({
data: function(){
return {
}
},
created:function () {
},
init:function (query,search) {
var type=query.type;
var id=search[1];
console.log(query);
console.log(search);
},methods:{
}
})
</script>
~~~
建议在created里和路径参数无关的逻辑;在init里写路径参数相关的逻辑;
### router 变量
* * * * *
this.router 还有两个参数
| 参数 |含义 |
| --- | --- |
| this.router.hash | 当前页面完整的hash |
| this.router.page | 当前页面组件 |