vue-router中的编程导航

网页中有两种跳转方式,通过a标签跳转,叫做标签跳转,通过window.local.herf的方式,叫做编程式导航

vue中,使用this.$router来实现编程式导航

this.$route与this.$router的区别:
this.$route是路由的"参数对象",所有路由中的参数,params,query都属于它,
this.$router是一个"导航对象",用它可以方便地使用JS代码,实现路由的前进,后退,跳转到新的url地址等功能

最简单的例如:

this.$router.push('/');

传递一个对象:

this.$router.push({path:"/home/product" + id})

传递命名的路由:

this.$router.push({ name: "goodsinfo", params: { id } });

替换当前的url:

this.$router.replace('/')

前进或者后退:

this.$router.go(n)
n是个整数,可让网页前进或者后退