vue $router.push,vue route.push

　　本文主要介绍这两者的区别。$路由器和这个。Vue中的$route和push()方法的相关信息。通过示例代码非常详细，对大家的学习或者工作都有一定的参考价值。有需要的朋友就跟着下面的边肖学习吧。

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

　　通过注入路由器，我们可以通过这个接入路由器。$router在任何组件中，或通过此访问当前路由。$route。

　　可以理解为：

　　这个。$router相当于一个全局路由器对象，包含了很多属性和对象(比如历史对象)。任何页面都可以调用它的push()、replace()、go()等方法。

　　这个。$route表示当前的route对象，每个route都会有一个route对象，这个route对象是一个本地对象，可以获取相应的属性如名称、路径、参数、查询等。

　　关于 push() 方法：

　　若要导航到不同的URL，请使用router.push方法。该方法将向历史堆栈中添加一条新记录，因此当用户单击浏览器的后退按钮时，它将返回到上一个URL。

　　当您单击router-link时，将在内部调用此方法。所以，点击路由器链接：to= . 相当于调用router.push(.).

　　push()方法的调用：

　　//字符串

　　这个。$router.push(home )

　　//对象

　　这个。$router.push({path:home})

　　//命名的路由

　　这个。$router.push({name:user ，params:{userId: 123}})

　　//带查询参数，成为/register？计划=私人

　　这个。$router.push({path:register ，query:{plan:private}})

　　注意：如果提供了路径，参数将被忽略。上述示例中的查询并非如此。相反，如以下示例所示，您需要提供路径名或带参数的手写完整路径：

　　const userId= 123

　　这个。$ router . push({ path:`/user/$ { userId } `})；//-/用户/123

　　这个。$router.push({name:user ，params:{ userId } })；//-/用户/123

　　//此处的参数不生效

　　这个。$router.push({path:/user ，params:{ userId } })；//-/用户

　　同样的规则也适用于路由器链接组件的to属性。

　　总结：

　　Params传递参数，push只能是名称：“xxx”，而不是路径：“/xxx”，因为params只能使用名称来引入路由。如果在此处写入path，则接收参数页将未定义。

　　路由传参的方式：

　　1.手写完整的路径：

　　这个。$ router . push({ path:`/user/$ { userId } `})；

　　获取参数：这个。$route.params.userId

　　2.按参数传输：

　　这个。$router.push({name:user ，params:{ userId: 123 } })；

　　获取参数：这个。$route.params.userId

　　Url形式：不带参数的url，http:localhost:8080/#/user

　　3.通过查询：

　　这个。$router.push({path:/user ，query:{ userId: 123 } })；

　　获取参数：这个。$route.query.userId

　　Url形式：带参数的url，http:localhost:8080/#/user？userId=123

　　说白了，query相当于get request。当页面跳转时，您可以在地址栏中看到请求参数。params相当于post请求，参数不显示在地址栏中。

　　请注意，以/开头的嵌套路径被视为根路径。这允许您在不设置嵌套路径的情况下充分利用嵌套组件。

　　总结

　　这就是这篇文章的区别。$路由器和这个。Vue中的$route和push()方法。有关这两者之间差异的更多信息。$路由器和这个。$route in Vue，请搜索我们之前的文章或者继续浏览下面的相关文章。希望大家以后能多多支持我们！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。