vue 路由学习笔记

一、路由跳转

1、push

注：跳转到指定url路径，并向history栈中添加一个记录，点击后退会返回到上一个页面

// 路由跳转 {路由名称，传递参数} => get请求
this.$router.push({
    path:"/Search",
    query:{ // 传递参数
        age:20
    }
});
// 参数获取
let name = this.$route.query.name;
1
2
3
4
5
6
7
8
9

// 路由跳转 {路由名称，传递参数} => post请求
this.$router.push({
    name:"Home",
    params:{ // 传递参数
        id:this.id
    }
});
// 参数获取
let params = this.$route.params;

1
2
3
4
5
6
7
8
9
10

2、replace（使用方法同push）

跳转到指定url路径，不会向history中添加记录，点击返回，会跳转到上上一个页面。上一个记录是不存在的。

3、go

// 向前或者向后跳转n个页面，n为正整数或负整数
this.$router.go(n)
1
2