在Vue中动态挂载组件

首先需要安装  cnpm install vue-router --save

在main.js中引入VueRouter 并使用

定义一个路由

创建router实例

通过router配置参数注入路由

关于嵌套路由

要在嵌套的出口中渲染组件，在需要VueRouter的参数中使用children配置：

college和major属于home的子路由

路由匹配的组件会显示在这里

 

Vue中路由的使用的更多相关文章

  1. vue中路由按需加载的几种方式

    使用vue-cli构建项目后,我们会在Router文件夹下面的index.js里面引入相关的路由组件,如: import Hello from '@/components/Hello' import ...

  2. vue中路由返回上一个页面,恢复到上一个页面的滚动位置

    第一步:路由文件的配置(对你所需要的vue文件进行保存缓存标志的添加) import Vue from 'vue' import Router from 'vue-router' import Hel ...

  3. vue中路由

    关于每次点击链接都要刷新页面的问题众所周知,开发单页应用就是因为那丝般顺滑的体验效果,如果每次点击都会刷新页面… 出现这个的原因是因为使用了window.location来跳转,只需要使用使用rout ...

  4. vue中路由传值url--路径传值

    在vue项目中我们使用路径的方式一般有一下两种方式this.$route.params.userId;一种需要在router上配置对应的数据key, this.$route.query.userId;

  5. vue中路由拦截无限循环的情况

    router.beforeEach(async (to, from, next) => { if (token) { if (whiteList.indexOf(to.path) != -1) ...

  6. Vue中路由的嵌套

    import Vue from 'vue'; import App from './App.vue'; //引入公共的scss 注意:创建项目的时候必须用scss import './assets/c ...

  7. vue中路由传参的方式

    一.params的类型: 配置路由格式: /router/:id 传递的方式: 在path后面跟上对应的值 传递后形成的路径: /router/123, /router/abc 通过:to字符串拼接的 ...

  8. vue中路由懒加载实现amd加载文件

    一般我们配置路由的时候是import引入: import log from '@/components/login': { path: '/login', component: log , hidde ...

  9. vue中路由跳转的底层原理

    前端路由是直接找到与地址匹配的一个组件或对象并将其渲染出来.改变浏览器地址而不向服务器发出请求有两种方式: 1. 在地址中加入#以欺骗浏览器,地址的改变是由于正在进行页内导航 2. 使用H5的wind ...

随机推荐

  1. Codeforces Round #282 (Div. 2) A

    解题思路:用数组将每一个显示数字可能表示的数字种数存储起来即可 反思:第一次做的时候没有做出来是因为题意理解错误,第二次WA是因为情况没有考虑完全,1对应有7个数字,5对应有4个数字       A. ...

  2. The 2018 ACM-ICPC Asia Qingdao Regional Contest, Online J Press the Button

    BaoBao and DreamGrid are playing a game using a strange button. This button is attached to an LED li ...

  3. gcc编译c中有与lua交互的代码

    编译C程序中有与Lua有关的程序(编译环境是Linux系统,lua解释器是luajit)gcc -o test30 test30.cpp -I/usr/local/include/luajit-2.0 ...

  4. [置顶] openHAB 部分代码结构 UML 图

    openHAB 部分代码结构 UML 图 ModelRepository: ItemRegistry: ItemUIProvider: WebAppServlet:

  5. IOS - No provisioning profiles with a valid signing identity 一种解决方法

    1.删除原有“钥匙串访问”中疑是过期的的证书: 2.在Member Center中Certificate中删除疑是有问题的Certificate,重新添加新的Certificate: 3.在“钥匙串访 ...

  6. js数组的一些骚操作 （用一行代码实现）

    1.扁平化n维数组 1.终极篇 [1,[2,3]].flat(2) //[1,2,3] [1,[2,3,[4,5]].flat(3) //[1,2,3,4,5] [1[2,3,[4,5[...]].f ...

  7. [Codeforces 115E]Linear Kingdom Races

    题目大意: 有n块地,初始是荒地.你可以把某些荒地开垦(需要花费相应的价值\(a_i\)(正整数)),然后这些荒地就可以种田. 现在有m年,每年要在l到r区间内种田,获得p(正整数)的价值(必须保证l ...

  8. DebugBar v7.0.2 注册码

    blog.sina.com.cn/seoerx 14d4fb95f89bdd277fff0d20910be400 seoerx.diandian.com 505dc8424062f9895c2dd14 ...

  9. WinServer-IIS-IIS负载均衡

    安装应用程序路由 提供的服务器的地址必须是可以访问,不然无法进入到下面的这个管理界面 来自为知笔记(Wiz)

  10. HDU 4333 Contest 4

    一开始就想到了扩展KMP,因为只有扩展KMP才是处理后缀的.但忽然短路以为扩展KMP求的是最长公共后缀,囧....又浪费了很多时间,都是对这个算法练得不多 再看那个扩展KMP算法之后,就很确定要的就是 ...