#在vue-cli所创建的项目中使用

　　进入到项目的目录后使用  npm install vue-router --save  安装vue-router，同时保存在webpack.Json配置文件中，然后在main.js使用方法如下：

　　

　　在第三步实例化路由是可以配置路由的信息，如下：

　　

　　

　　区别在于：前者地址为http://localhost:8080/#/apple,后者地址为http://localhost:8080/apple，且后者可以根据router-link跳转到指定的路由。

然后就可以在页面（app.vue）中使用路由啦：

　　

vue2.0中vue-router使用总结的更多相关文章

  1. Vue中美元$符号的意思与vue2.0中的$router 和 $route的区别

    vue的实例属性和方法 除了数据属性,Vue 实例还暴露了一些有用的实例属性与方法.它们都有前缀 $,以便与用户定义的属性区分开来.例如: var data = { a: 1 } var vm = n ...

  2. vue2.0中的$router 和 $route的区别

    1.router是VueRouter的一个对象,通过Vue.use(VueRouter)和VueRouter构造函数得到一个router的实例对象,这个对象中是一个全局的对象,他包含了所有的路由包含了 ...

  3. router-view在vue2.0中不显示，解决方法

    学习的router-view路由一直不显示,我翻看vue文档,花费1个小事终于找到原因,希望我的问题能给初学的同学,带来福音,版本不一样,真的烦 在此总结记录,以免以后在此遇到此问题 //配置路由 c ...

  4. Vue2.0中的路由配置

    Vue2.0较Vue1.0,路由有了较大改变.看一下Vue2.0中的路由如何配置: 步骤一: 在main.js文件中引入相关模块以及组件及实例化vue对象配置选项路由及渲染App组件 默认设置如下: ...

  5. Vue2.0总结———vue使用过程常见的一些问题

    Vue目前的的开发模式主要有两种:1.直接页面级的开发,script直接引入Vue2.工程性开发,webpack+loader或者直接使用脚手架工具Vue-cli,里面的文件都配置好了 webpack ...

  6. vue2.0中router-link详解

    vue2.0中router-link详解:https://blog.csdn.net/lhjuejiang/article/details/81082090 在vue2.0中,原来的v-link指令已 ...

  7. Vue2.0 中，“渐进式框架”和“自底向上增量开发的设计”这两个概念是什么？（转）

    https://www.zhihu.com/question/51907207?rf=55052497 徐飞 在我看来,渐进式代表的含义是:主张最少. 每个框架都不可避免会有自己的一些特点,从而会对使 ...

  8. Vue2.0中的transition组件

    组件的过度 Vue1.0中transition做为标签的行内属性被vue支持.但在Vue2.0中.Vue放弃了旧属性的支持并提供了transition组件,transition做为标签被使用. 使用t ...

  9. vue2.0 vs vue

    vue2.0相比vue1.0 有哪些改变,今天总结了一下 vue2.0组件中 template 不在支持代码片段 //vue1.0组件中template写法 <template> < ...

  10. vue2.0中使用pug(jade)

    第一部分:pug(jade)模板引擎 pug,原名jade,是流行的HTML模板引擎,它是HAML在JavaScript上的实现,最大的特色是使用缩进排列替代成对标签. 它简化了HTML的成对标签的写 ...

随机推荐

  1. ES6 async await

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 第十四届浙江财经大学程序设计竞赛重现赛--A-A Sad Story

    链接:https://www.nowcoder.com/acm/contest/89/A 来源:牛客网 1.题目描述 The Great Wall story of Meng Jiangnv’s Bi ...

  3. 老刘的Linux小课堂开课了

    经过几个月的等待,刘遄老师的LINUX课堂终于开课了,从现在开始,我会在博客里将每一堂课的笔记记录下来,记录自己的每一步成长. 由于是第一次开课,老刘只是简单的介绍了LINUX相关的一些概念,比如开源 ...

  4. python核心编程2 第十章 练习

    10-6.改进的open().为内建的open()函数创建一个封装.使得成功打开文件后,返回文件句柄:若打开失败则返回给调用者None, 而不是生成一个异常.这样你打开文件就不需要额外的异常处理语句. ...

  5. python一个小程序：猜数字

    猜数字游戏程序运行示例: I am thinking of a number between 1 and 20. Take a guess. 8 Your guess is too low. Take ...

  6. STM32进阶之串口环形缓冲区实现（转载）

    转载自微信公众号“玩转单片机”,感谢原作者“杰杰”. 队列的概念 在此之前,我们来回顾一下队列的基本概念:队列 (Queue):是一种先进先出(First In First Out ,简称 FIFO) ...

  7. 001---Linux系统的启动过程

    Linux系统的启动过程 按下电源 开机自检(BIOS):检查cpu.内存.硬盘是否有问题,找到启动盘. MBR引导(master boot record):主引导记录,读取存储设备的512bytes ...

  8. （数据科学学习手札35）tensorflow初体验

    一.简介 TensorFlow时谷歌于2015年11月宣布在Github上开源的第二代分布式机器学习系统,目前仍处于快速开发迭代中,有大量的新功能新特性在陆续研发中: TensorFlow既是一个实现 ...

  9. nodejs环境搭建与express安装配置

    一.NPM 1.下载nodeJS 下载地址:https://nodejs.org/en/download/ 因为我的系统是Linux 的,所以下载已经编译好的Linux,nodejs tar包 3.下 ...

  10. javascript-es6学习笔记

    es6技术培训文档 第一阶段:1.let与const用法2.变量的解构赋值3.字符串的扩展4.正则的扩展5.数组的扩展6.函数的扩展7.对象的扩展8.Symbol9.Set和Map数据结构 第二阶段: ...