自己写一个Vue子路由

一:路由:在URL中采用#号来作为当前视图的地址,改变#号后的参数,页面并不会重载。

二:路由:是(SPA)单页应用的路径管理器,单页应用相当于只有一个index.html页面,改变路径可切换至不同的页面

子路由:

比如有一个地址,圈出的地方在banana目录下,可以是b1,也可以是b2,那么b1,b2就叫做banana的子路由


image.png

创建子路由的步骤:

1、首先做两个导航,分别是banana下边的1号和2号。在App.vue里做


image.png

2、在components目录下创建两个文件,分别是b1.vue和b2.vue,两个文件的内容相似即可


image.png

3、在老父亲banana.vue中添加一行。router-view是为了给子模板提供插入位置。b1,b2是banana的子页面,就像继承一样


image.png

4、在Router文件夹的index.js中添加路由规则


image.png

children字段后边跟的是个数组,数组里和其他配置路由基本相同,需要配置path和component。


image.png

推荐阅读更多精彩内容

  • 前言:上次简单介绍了vue-router,并且创建了两个路由,如果还没学过路由基础知识请点这里 子路由:比如有一个...
    椰果粒阅读 4,221评论 0 5
  • “怨妇”这俩字有着沉重的色彩。女人一旦开始喋喋不休地抱怨,就会把身边的男人吓跑。可婚姻生活中,哪有时时刻刻都能恩爱...
    晓雨飞燕阅读 405评论 1 4
  • //联系人:石虎QQ:1224614774昵称:嗡嘛呢叭咪哄 一、概念 1.打开xcode 中的Launch Sc...
    石虎132阅读 331评论 0 8