this.$router和this.$route的区别以及使用

时间:2025-04-08 14:57:53

this.$router

this.$router 全局路由对象,任何页面都可以通过此方法 调用 push(), go()等方法。一般用于路由跳转。
如:

this.$(路由)

跳转指定路由;

this.$({
	path: '/datadisplay',
	query: {state: },  // 这个是放在?后面的
	// 如:this.$({'path':'/asv', query:{a=1}}),生成的路由为:/asv?a=1

	// path不能和params一起使用,否则params将无效。需要用name来指定页面。
	name: 'datadisplay',
	params: {id: },  // 这个是放在路由里面的。
	// 如果路由为/datadisplay:id 。:id占位符通过params里的{id: }赋值的(必须要和占位符的字母一样)
	// 路由为/datadisplay/:id,params: {id: 123} 那么最后生成的路由为:/datadisplay/123
	// 当然没有占位符也可以设置传入参数params: {id: },只是路由上没有显示
})

传参:query与params



this.$route

this.$route 表示当前正在用于跳转的路由器对象。可用来接受当前路由,显示其name、path、query、params等属性。
如:

this.$

显示当前路由?后的参数