1,//创建 router 实例

  var router = new VueRouter()

2,//components下新建home.vue组件,并在app.vue中引入模块:

import home from './components/home/home.vue';

3,//路由地址

  router.map({

//路由规则

    })

4,//启动一个启用了路由的应用

  router.start(App,'app')

5,Vue作用范围内设置路由跳转

  <a v-link="{path:'/home'}"></a>

  <router-view></router-view>//路由渲染出来的内容的位置

main.js文件如下:

路由嵌套:

1,新建Login.vue 和 Reg.vue

2,import引入

3,subroute设置

4,vue文件设置 <a a-link="{path:'地址'}"></a>设置路由跳转地址

.vue文件如下

main.js文件如下

vue1.0配置路由的更多相关文章

  1. vue2.0配置路由

    配置路由之前,先检查vue版本,(案例适用vue2.0) 采用npm包的形式进行安装. 安装路由依赖:npm install vue-router(代码中,如果在一个模块化工程中使用它,必须要通过 V ...

  2. 配置子目录Web.config使其消除继承,iis7.0设置路由

    iis7.0设置路由 ,url转向,伪静态 <system.webServer>      <modules runAllManagedModulesForAllRequests=& ...

  3. asp.netCore3.0 中使用app.UseMvc() 配置路由

    一.新配置路由策略  在 Asp.Net Core 3.0中默认不再支持app.UserMvc() 方式配置路由 系统. 而是使用新的模式,点击查看asp.netCore3.0区域和路由配置变化 默认 ...

  4. 使用vue1.0+es6+vue-cli+webpack+iview-ui+jQuery 撸一套高质量的后台管理系统

    首先按照vue.js官网的指令安装: 1.本地安装好node.js 2.根据官方命令行工具 详情 这样一个官方的脚手架工具就已经搭建好了:但是有一点需要注意的是由于现在按照官方的搭建方法是搭建vue2 ...

  5. 【重点突破】—— Vue1.0到Vue2.0的变化

    前言: 本文参考作者:_So_ 和 我是某慧 的博文,重点梳理Vue1.0升级到Vue2.0后在开发中要注意的不同,以做学习.        组件模板不再支持片段代码,必须有一个顶级元素包裹,例如: ...

  6. Vue1.0用法详解

    Vue.js 不支持 IE8 及其以下版本,因为 Vue.js 使用了 IE8 不能实现的 ECMAScript 5 特性. 开发环境部署 可参考使用 vue+webpack. 基本用法 1 2 3 ...

  7. ESXi 6.0 配置

    ESXi 6.0 添加静态路由 首先打开ESXi的SSH服务, 在Configuration -> Security Profile -> Services , start SSH 用管理 ...

  8. vue-router2.0动态路由获取参数

    一下demo演示2.0中的vue-router是如何获取到不同参数的,并在地址栏中匹配不同的信息 <!DOCTYPE html> <html lang="en"& ...

  9. 个人Vue-1.0学习笔记

    dVue.js是类似于angular.js的一套构建用户界面的渐进式框架,只关注视图层, 采用自底向上增量开发的设计. Vue.js的代码需要放置在指定的HTML元素后面. 关于Vue的数据绑定: 例 ...

随机推荐

  1. DataGridView 列排序 内存表查找

    DataRow[] drow = dt.Select("列名 = 列名的值" ); 就这句话,dt是一个datatable 且断点调试时能看到里面有trade这个列,可为什么执行到 ...

  2. spring boot常见问题

    1.什么是springboot 用来简化spring应用的初始搭建以及开发过程 使用特定的方式来进行配置(properties或yml文件) 创建独立的spring引用程序 main方法运行 嵌入的T ...

  3. redis 在 php 中的应用(Hash篇)

    本文为我阅读了 redis参考手册 之后结合 博友的博客 编写,注意 php_redis 和 redis-cli 的区别(主要是返回值类型和参数用法) Redis hash 是一个string类型的f ...

  4. PyTorch in Action: A Step by Step Tutorial

    PyTorch in Action: A Step by Step Tutorial   PyTorch in Action: A Step by Step Tutorial Installation ...

  5. Hibernate一级缓存和二级缓存详解

    (1)一级缓存 是Session级别的缓存,一个Session做了一个查询操作,它会把这个操作的结果放在一级缓存中,如果短时间内这个session(一定要同一个session)又做了同一个操作,那么h ...

  6. python3中argparse模块

    1.定义:argparse是python标准库里面用来处理命令行参数的库 2.命令行参数分为位置参数和选项参数:         位置参数就是程序根据该参数出现的位置来确定的              ...

  7. Pandas数据处理+Matplotlib绘图案例

    利用pandas对数据进行预处理然后再使用matplotlib对处理后的数据进行数据可视化是数据分析中常用的方法. 第一组例子(星巴克咖啡店) 假如我们现在有这样一组数据:星巴克在全球的咖啡店信息,如 ...

  8. JavaScript代码压缩工具UglifyJS和Google Closure Compiler的基本用法

    网上搜索了,目前主流的Js代码压缩工具主要有Uglify.YUI Compressor.Google Closure Compiler,简单试用了UglifyJS 和Google Closure Co ...

  9. mc面试题记录

    1.linux 查看磁盘空间 df -hl 2.根目录下有哪些文件及其作用 3.查找/tmp下的文件内容含有abc的命令 grep -rn "abc" /tmp4.linux下的s ...

  10. vue安装之后的报错处理---chromedriver@2.35.0 install: `node install.js`

    报错:chromedriver@2.35.0 install: `node install.js` 这个错误的解决方法就是在你创建的项目目录,比如你创建的项目叫myVue,然后你就要在myVue这个目 ...