vue跳转页面的几种常用方法

目录

vue 跳转不同页面的方法

1.router-link 跳转

2.this.$router.push()

3.a 标签可以跳转外部链接，不能路由跳转

vue 三种不同方式实现跳转页面

Vue：router-link

this.$router.push(“/”)

this.$router.go(1)

代码示例：

vue 跳转不同页面的方法

1.router-link 跳转

  点击跳转 2

 


  点击跳转 1

 

  点击跳转 3

2.this.$router.push()

3.a 标签可以跳转外部链接，不能路由跳转

点击跳转 5

接收：this.$route.query.serid 和 this.$route.params.setid

vue 三种不同方式实现跳转页面

Vue：router-link

 [跳转到主页]
 [登录]
 [登出]
this.$router.push(“/”);

this.$router.push(“/”)

[跳转到主页]
export default {
 name: “App”,
 methods: {
 // 跳转页面方法
 goHome() {
 this.$router.push(“/”);
 },
}

this.$router.go(1)

 [上一页]
 [下一页]
 upPage() {
 // 后退一步记录，等同于 history.back()
 this.$router.go(-1);
 },
 downPage() {
 // 在浏览器记录中前进一步，等同于 history.forward()
 this.$router.go(1);
 }
 

代码示例：