route和router的区别

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

在Vue.js中,routerouter是两个相关但不同的概念。

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

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

简而言之,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时,对应的组件将会被渲染到页面中。

  • 6
    点赞
  • 12
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值