route和router的区别-Toy模板网

这篇具有很好参考价值的文章主要介绍了route和router的区别。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

router为VueRouter的实例。
$route可以从当前router跳转对象里面可以获取name、path、query、params等数据
$router为VueRouter实例，想要导航到不同URL，则使用$router.push方法

在Vue.js中，route和router是两个相关但不同的概念。

route（路由）指的是应用程序中定义的单个页面的配置信息。每个路由都有一个路径（path），以及与之关联的组件（component），还可以包含其他属性如名称（name）、参数（params）等。路由的作用是定义了URL与组件的对应关系，当用户访问某个URL时，路由系统将根据配置找到对应的组件进行渲染。

router（路由器）是一个实例化的Vue Router对象，它是Vue.js应用程序中负责管理路由的主要机制。通过创建一个router对象，我们可以定义应用程序的所有路由规则，并将其挂载到Vue实例上。router对象提供了一些方法和属性，例如push、replace、go等，用于导航和控制路由。

简而言之，route是指单个页面的配置信息，而router则是整个路由系统的管理者。通常我们会创建一个router对象，并使用route配置来定义应用程序的各个页面和URL之间的映射关系。

例如：

import Vue from 'vue';
import VueRouter from 'vue-router';

Vue.use(VueRouter);

const router = new VueRouter({
  routes: [
    {
      path: '/',
      component: Home
    },
    {
      path: '/about',
      component: About
    },
    // 其他路由配置...
  ]
});

new Vue({
  router,
  render: h => h(App)
}).$mount('#app');

在上述代码中，我们创建了一个router对象，并将其挂载到Vue实例上，定义了两个路由：/对应Home组件，/about对应About组件。这样当用户访问不同的URL时，对应的组件将会被渲染到页面中。文章来源地址https://www.toymoban.com/news/detail-803056.html

到了这里，关于route和router的区别的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！