vue中路由传值

官房文档里是这样说明的:

通过注入路由器,我们可以在任何组件内通过 this.$router 访问路由器,也可以通过 this.$route 访问当前路由

可以理解为:

     this.$router 相当于一个全局的路由器对象,包含了很多属性和对象(比如 history 对象),任何页面都可以调用其 push(), replace(), go() 等方法。

this.$route 表示当前路由对象,每一个路由都会有一个 route 对象,是一个局部的对象,可以获取对应的 name, path, params, query 等属性。

this.$router.push()跳转页面的记录点:

     1.直接写路由地址:eg:this.$router.push('/hello');可以直接跳转到hello页面;

     2.path-query方式传值:eg:this.$router.push({path:'/hello',query:{state:'参数1',value:'参数2',……}}),跳转后会把参数跟在地址栏后面,在地址栏上可以查看,类似于get请求,跳转的目标页面可以用this.$route.query.state,this.$route.query.value,……去获取传过来的值;

     3.name-params方式:eg:this.$router.push({name:'hello',params:{state:'参数1',value:'参数2',……}}),地址栏不会出现参数,类似于post请求,跳转的目标页面可以用this.$route.params.state,this.$route.params.value,……去获取传过来的值

猜你喜欢

转载自www.cnblogs.com/sunshineForFuture/p/11911615.html