在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. Unity 动画系统(Mecanim)的组成结构

    三部分: Model Rigging(直译传动装置,术语翻译绑定)(连接Model与Animations) Animations

  2. servlet中地址详细分析

    path路径的写法 假设; 项目名为day01 webroot下存放静态文件demo.html 转发 request.getRequestDispatcherType("path" ...

  3. 利用Java反射根据类的名称获取属性信息和父类的属性信息

    代码: import java.lang.reflect.Field; import java.util.ArrayList; import java.util.Arrays; import java ...

  4. set 集合————两个数组的交集

    class Solution { public: vector<int> intersection(vector<int>& nums1, vector<int& ...

  5. 路飞学城Python-Day32

    36-进程池线程池 开多线程实现并发的效率是高的,当用户没有那么多的时候,服务器是可以承受压力的 但是一定要以某种方式来设置并发数,让服务器能够实现稳定的运行,控制服务器的线程数 设置池,往里面放池的 ...

  6. 洛谷4623 [COCI2012-2013#6] BUREK

    题目描述 给定N个三角形,和M条直线,直线要么平行于X轴,要么平行于Y轴,问这M条直线 分别经过多少个三角形内部 (注意是内部即分开的两个多边形的面积均大于零). 输入输出格式 输入格式: 第一行一个 ...

  7. Shell（三）流程控制

    Shell 流程控制 和Java.PHP等语言不一样,sh的流程控制不可为空,如(以下为PHP流程控制写法): <?php if (isset($_GET["q"])) { ...

  8. 光盘文件的挂载和yum源配置

    一.挂载光盘文件 1.将光盘推入 2.新建挂载点 mkdir /mnt/cdrom 3.挂载 3.1临时挂载 mount /dev/dcrom /mnt/cdrom 或者 mount  –t  iso ...

  9. maven这些工具负责创建项目，然后maven负责打包好war包扔进tomcat容器，tomcat容器接受的只是jar包

    maven这些工具负责创建项目,然后maven负责打包好war包扔进tomcat容器,tomcat容器接受的只是jar包 2.tomcat不管你什么编译的,也不管你开发工具是什么.Tomcat只接受w ...

  10. grep常见使用方法总结

    grep -E 'l\{2,\}' 2.txt grep -E 'h(ell|a)o' test.txt grep '[a-z]\{5,\}' test.txt grep -xf a.txt b.tx ...