1,首先用vue-cli搭建vue项目。这个我就不细说了,详见以前的博客

2,npm安装vue-router

3.打开router文件加下的index.js

4.导入你想跳转的组件。

import zujian from ‘@/views/.......’

5.在routes数组中加一个对象

{

path:'要跳转的路径',

name:'名字',

component:‘zujian’

}

6.找到跳转按钮

<router-link to="上面的path值“>跳转按钮</router-link>

vue配置路由的更多相关文章

  1. angular配置路由/子页面+vue配置路由/子页面

    1.在vue.js中组件可以复用,然后最近配置了几个子页面 在 这个文件中配置路由,子页面的配置跟其他一样,只不过path不同.   routes: [     { path: '/',       ...

  2. vue配置路由时报错 Error in render: "RangeError: Maximum call stack size exceeded"

    虽然标题写的是配置路由报错,最终也是通过修改路由解决的,但是导致报错的还有一个主要因素,是因为我增加了一个功能“页面刷新时,根据url高亮左侧导航”,如下图: 1.页面刷新,根据url高亮左侧导航代码 ...

  3. Vue配置路由和传参方式及路由守卫!

    安装路由 npm i vue-router -S 引入路由 import VueRouter form VueRouter 注入路由模块 Vue.use(VueRouter) 定义路由匹配规则 let ...

  4. vue+element-ui路由配置相关

    vue+element-ui路由配置相关 转自:http://www.cnblogs.com/MonaSong/p/6703804.html vue-router2中说明了,子路由前面可以不加'/', ...

  5. 搭建Flask+Vue及配置Vue 基础路由

    最近一直在看关于Python的东西,准备多学习点东西.以前的项目是用Vue+Java写的,所以试着在升级下系统的前提下.能不能使用Python+Vue做一遍. 选择Flask的原因是不想随大流,并且比 ...

  6. vue入门----------路由配置

    在使用脚手架搭建好项目后要配置路由 1.首先要安装vue-router,你可以在项目的package.json文件中的dependencies项目中添加"vue-route": & ...

  7. vue的路由配置

    路由,其实就是指向的意思,当我点击页面上的home按钮时,页面中就要显示home的内容,如果点击页面上的about 按钮,页面中就要显示about 的内容.Home按钮 => home 内容, ...

  8. vue如何配置路由 、获取路由的参数、部分刷新页面、缓存页面

    vue如何配置路由 .获取路由的参数.部分刷新页面.缓存页面:http://www.mamicode.com/info-detail-1941546.html vue-router传递参数的几种方式: ...

  9. Vue之创建组件之配置路由!

    Vue之创建组件之配置路由!== 第一步: 当然就是在我们的试图文件夹[views]新建一个文件夹比如home 在home文件夹下面新建一个文件index.vue 第二步:在router目录下做如下事 ...

随机推荐

  1. atitit.jndi的架构与原理以及资源配置and单元測试实践

    atitit.jndi的架构与原理以及资源配置and单元測试实践 1. jndi架构 1 2. jndi实现原理 3 3. jndi资源配置 3 3.1. resin  <database> ...

  2. PipeCAD之管道标准库PipeStd

    PipeCAD之管道标准库PipeStd eryar@163.com Key Words. PipeCAD, PipeStd, 管道设计软件,管件库 1. Introduction 前不久,两位老友徐 ...

  3. hdu 1875 畅通project再续(kruskal算法计算最小生成树)

    畅通project再续 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Tota ...

  4. 设置select组件中的默认值

    会员卡类型   <select id="name2" style="width:140px"> <option value="Ak& ...

  5. Razor数组数据

    控制器层 public ActionResult DemoArray() { Product[] array = { new Product {Name = "Kayak", Pr ...

  6. 用Nagios监控Sql Server服务器

    在Suse 下配置Nagios来监控Ms SQL Server操作演示 本文出自 "李晨光原创技术博客" 博客,谢绝转载!

  7. postgresql 不同数据库不同模式下的数据迁移

    编写不容易,转载请注明出处谢谢, 数据迁移 因为之前爬虫的时候,一部分数据并没有上传到服务器,在本地.本来用的就是postgresql,也没用多久,数据迁移的时候,也遇到了很多问题,第一次使pg_du ...

  8. UVALive 5292 Critical Links

    Critical Links Time Limit: 3000ms Memory Limit: 131072KB This problem will be judged on UVALive. Ori ...

  9. RecyclerView下拉刷新和载入很多其它

    之前一直写的是ListVIew下拉刷新,可是好多朋友都说要RecycleView的下拉刷新和滑动载入.事实上,这个原理都是几乎相同.抽出时间,我就写了下RecycleView的下拉刷新和滑动载入很多其 ...

  10. OpenGL核心技术之混合技术

    笔者介绍:姜雪伟,IT公司技术合伙人,IT高级讲师,CSDN社区专家,特邀编辑,畅销书作者.国家专利发明人;已出版书籍:<手把手教你架构3D游戏引擎>电子工业出版社和<Unity3D ...