1 路由配置

在vue.config中配置,则在代码中可以使用 @来表示src目录下

import aa from '@/aa/index.js'

2 单页面可以懒加载

3 创建动态路由 路由中定义:(加载同一个组件页面 argu.vue,根据不同的name 显示不同的东西)

Vue组件中获取数据:

$route.parmas.name

4 命名路由,也就是给路由设置名称,在同一个页面加载不同的路由     比如说公共的头部导航栏组件 不用在每个页面中引入,而是可以使用命名视图的方式在路由中定义,如果某个页面不存在,则在路由配置文件中修改配置信息,不添加组件信息即可,详见下面的文章:

vue-router命名视图的意义

路由配置,注意有s:

页面中引用:

5 路由重定向

Vue的路由动态重定向和导航守卫

6 js控制路由:

带参数:

vue学习笔记——路由的更多相关文章

  1. vue 学习笔记—路由篇

    一.关于三种路由 动态路由 就是path:good/:ops    这种 用 $route.params接收 <router-link>是用来跳转  <router-view> ...

  2. vue学习笔记(十)路由

    前言 在上一篇博客vue学习笔记(九)vue-cli中的组件通信内容中,我们学习组件通信的相关内容和进行了一些组件通信的小练习,相信大家已经掌握了vue-cli中的组件通信,而本篇博客将会带你更上一层 ...

  3. Vue学习笔记-Vue.js-2.X 学习(六)===>脚手架Vue-CLI(项目说明-Babel)

    五  Vue学习-vue-cli脚手架学习(创建只选一个选项:Babel) 1. 项目目录说明 node_modules : 包管理文件夹 public : 静态资源 src : 源代码 gitign ...

  4. Vue学习笔记-Vue.js-2.X 学习(四)===>脚手架Vue-CLI(基本工作和创建)

    (五) 脚手架Vue-CLI 一 Vue-CLI前提(nodejs和webpack) 二  Vue学习-nodejs按装配置,Node.js 就是运行在服务端的 JavaScript. 1. 去nod ...

  5. Vue学习笔记-rest_framework_jwt 学习

    一  使用环境 开发系统: windows 后端IDE: PyCharm 前端IDE: VSCode 数据库: msyql,navicat 编程语言: python3.7  (Windows x86- ...

  6. Vue学习笔记-Django REST framework3后端接口API学习

    一  使用环境 开发系统: windows 后端IDE: PyCharm 前端IDE: VSCode 数据库: msyql,navicat 编程语言: python3.7  (Windows x86- ...

  7. Vue学习笔记-vue-element-admin 前端学习

    一  使用环境 开发系统: windows 后端IDE: PyCharm 前端IDE: VSCode 数据库: msyql,navicat 编程语言: python3.7  (Windows x86- ...

  8. Vue学习笔记-2

    前言 本文非vue教程,仅为学习vue过程中的个人理解与笔记,有说的不正确的地方欢迎指正讨论 1.computed计算属性函数中不能使用vm变量 在计算属性的函数中,不能使用Vue构造函数返回的vm变 ...

  9. Vue学习笔记-1

    前言 本文不是Vue.js的教程,只是一边看官网Vue的教程文档一边记录并总结学习过程中遇到的一些问题和思考的笔记. 1.vue和avalon一样,都不支持VM初始时不存在的属性 而在Angular里 ...

随机推荐

  1. 整合SpringData JPA

    ORM(Object Relational Mapping): 1).编写一个实体类(bean)和数据表进行映射,并且配置好映射关系: //使用JPA注解配置映射关系 @Entity //告诉JPA这 ...

  2. composer修改成国内镜像

    因为composer安装包数据是从github.com上下载的,安装包的元数据从packagist.org上下载 作为两个国外的网站,连接速度会很慢,而且很有可能网站被墙. 所以composer中国全 ...

  3. flask配置文件的几种方法

    配置文件的参数 flask中的配置文件是一个flask.config.Config对象(继承字典),默认配置为: { 'DEBUG': get_debug_flag(default=False), 是 ...

  4. Vue项目在真机测试

    一:修改config 找到config文件夹下的index.js文件并修改为: module.exports = { dev: { host: '0.0.0.0' // 原为: hotst: 'loc ...

  5. ZCRM_AU_MAIL

    FUNCTION ZCRM_AU_MAIL. *"---------------------------------------------------------------------- ...

  6. koa和express对比

    不同: 1.启动方式不同 koa采用了new Koa()的方式,而express采用传统的函数形式 2.中间件形式二者不一样,这是由二者处理中间件的逻辑差异导致的,实际上这也是二者最根本的差别 3.k ...

  7. Python3+SQLAlchemy+Sqlite3实现ORM教程

    一.安装 Sqlite3是Python3标准库不需要另外安装,只需要安装SQLAlchemy即可.本文sqlalchemy版本为1.2.12 pip install sqlalchemy 二.ORM操 ...

  8. Oracle获取当前年、月、日的方法

    Oracle获取当前年.月.日的方法 Oracle 获取当前年.月.日 1.//oracle中extract()函数从oracle 9i中引入,用于从一个date或者interval类型中截取到特定的 ...

  9. Python装饰器基础及运行时间

    一.装饰器基础 装饰器是可调用的对象,其参数是另一个函数(被装饰的函数).装饰器可能会处理被装饰的函数,然后把他返回,或者将其替换成另一个函数或可调用对象. eg:decorate装饰器 @decor ...

  10. [SCOI2005]繁忙的都市

    emm...就是个最小生成树板子...我还能说啥... 为啥我早出生个十多年.../(ㄒoㄒ)/~~ 五六年也好啊.../(ㄒoㄒ)/~~ 呆码: #include<iostream> # ...