Vue路由router以及route与router的区别

柔情只为你懂 2023-10-05 11:37 113阅读 0赞

VueCli

  • Vue的router的理解
    • router与route的区别
      • VueCli怎么使用Router

Vue的router的理解

我们要实现单页应用程序，所以我们要学习路由。
router能够帮助我们组件之间的跳转
下面我们看网易云音乐的例子
在这里插入图片描述
在头部栏有很多组件，而在我们点击那些组件就会又出现很多组件，这就运用到了嵌套路由。这就是路由的实现

router与route的区别

1.router是VueRouter的一个对象，通过Vue.use(VueRouter)和VueRouter构造函数得到一个router的实例对象，这个对象中是一个全局的对象，他包含了所有的路由包含了许多关键的对象和属性。
2.route是一个跳转的路由对象，每一个路由都会有一个route对象，是一个局部的对象，可以获取对应的name,path,params,query等

VueCli怎么使用Router

1、首先创建vuecli项目(这里就不多说了)
2、定义全局路由 声明路由规则全局路由创建
BrandList是自己创建的组件,在routes下面进行路由的跳转
3、最后进行导出
4、在main.js里进行引入并挂挂载就可以使用了路由挂载
5、组件上使用(我是默认在App.vue组件上使用的)(组件使用路由)
router-link进行路由跳转，在我们第一步进行生命路由那里有跳转路径，所以我们直接to=”/路径” 就可以了
而router-view呢就是我们点击跳转路由进行显示在哪个地方(单页显示哦)

写的不是很好，新手上路还请多多指教！！

发表评论

表情：
评论列表 （有 0 条评论，113人围观）

还没有评论，来说两句吧...

相关阅读

    相关 vue-router路由

    > 在这个世界上取得成就的人，都努力去寻找他们想要的机会，如果找不到机会，他们便自己创造机会。 > 你好，我是梦阳辰！期待与你相遇！ 文章目录 01.什么是路

    青旅半醒青旅半醒/ 0 赞/ 321 阅读