vue编程式导航

改变入口的三种方式

1、手动输入

2、声明式导航

<router-link to="home1">home1</router-link>

3、编程式导航

this.$router路由实例 学习它的三个方法

3.1、push（）跳转

this.$router.push(path路径)

3.2、back（）返回

this.$router.back()

3.3、replace（）替换//回到原始 不可以返回跳转前的页面

this.$router.replace(path路径)

使用场景：支付页面=>支付成功页面

示例：

one.vue

<button @click="jump">jump</button>

jump() {
//   this.$router.push("/two");
  this.$router.replace("/two");
},

two.vue

<button @click="back">back</button>

back() {
this.$router.back();
},

main.js

import one from '@/components/Route1.vue'
import two from '@/components/Route2.vue'

const router = new VueRouter({
  routes: [
    { path: '/one', component: one },
    { path: '/two', component: two },
  ]
})

3.4、go（num）前进或后退几步

3.5、forward（）前进