#在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. aes 加密，解密（2）

    JavaScript加密,解密 1,此为AES加密后,转换为16进制编码 var encodePwd = function (data,key){ var keyHex = CryptoJS.enc. ...

  2. 一、spring 4概述

    0 前言 0.0 Spring 来历 Spring 是于2003年兴起的一个轻量级的Java 开发框架, 为了解决企业应用开发的复杂性而创建, 核心是控制反转(IoC)和面向切面编程(AOP). 简单 ...

  3. 快速创建显示数字数据的动画——CountUp.js

    由于项目需求,需要写一个数字增/减量的动画特效,最后找到了CountUp.js CountUp.js是一个无依赖,轻量级的JavaScript“类”,可用于快速创建以更有趣的方式显示数字数据的动画. ...

  4. 判断Map集合中是否存在某一个key

    方法一: Map<String,String> hashmp = ne HashMap(); hashmp.put("aa", "111"); ha ...

  5. 使用Python读取Dbf文件

    DBF:一种特殊的文件格式!表示数据库文件,Foxbase,Dbase,Visual FoxPro等数据库处理系统所产生的数据库文件! DBF 数据库是常用的桌面型数据库,它曾经被各企业.事业单位广泛 ...

  6. 简单使用PuTTy登录centos虚拟机

    博主刚刚开始学习Linux,想通过写博客的方式加深对linux学习的记忆 使用虚拟机安装精简版的linux后发现窗口字体太小,于是就想着通过PuTTy登录的方式解决 简单安装linux后 将linux ...

  7. C# register global hotkey ,onekey 注册多个全局热键以及单个全局热键

    我们需要用非Hook的方法,来给我们的app 或者winform注册热键. 就像下面的 , 欧陆词典注册的一个热键F6一样, 在winform最小化的情况下,也能够全局响应热键. 这里使用系统API来 ...

  8. jquery获取周对应的日期

    项目中用到按周显示的功能,找了一个,然后自己修改了一下,留着以后用: 这是代码,要是直接显示的话就把第43行去掉就行了,如果想要得到数据按照自己的想法重新渲染就保留43行,直接看51行,52行就是你要 ...

  9. scrapy框架爬取笔趣阁

    笔趣阁是很好爬的网站了,这里简单爬取了全部小说链接和每本的全部章节链接,还想爬取章节内容在biquge.py里在加一个爬取循环,在pipelines.py添加保存函数即可 1 创建一个scrapy项目 ...

  10. Python自动化运维——系统进程管理模块

    Infi-chu: http://www.cnblogs.com/Infi-chu/ 模块:psutil psutil是一个跨平台库,可以很轻松的为我们实现获取系统运行的进程和资源利用率等信息. 功能 ...