vue-router的路由切换方式

路由切换大方面可分为两类：一类是标签，另一类是编程导航。

第一种：router-link标签

router-link 和a标签一样，点击后跳转，to 属性指定跳转路由的地址，具体代码如下：

<router-link   to="/home">点击跳转home</router-link>

 

第二种：编程导航

当然我们不能每次跳都通过点击链接来切换，所以我们还可以通过函数来跳转，vue-router 提供了push、replace、go三种方法给我们用，我们简单看一下，所提供方法具体的参数可参见官方文档

//导航到新路由时，会向history栈中添加一条新的记录
router.push({ path: '/home' })


//跟router.push类似，唯一不同的是：它不会向history添加新纪录，正如它的名字的意思那样——而是替代掉当前的history记录
router.replace({ path: '/home' })


//这个方法的参数n是一个整数，意思是在history记录中前进或后退多少步，类似于 window.history.go(n)
router.go(n)