在使用脚手架搭建好项目后要配置路由

1、首先要安装vue-router，你可以在项目的package.json文件中的dependencies项目中添加"vue-route": "版本号"，然后在使用命令行cnpm install安装

或者直接使用命令cnpm install vue-router --save进行安装

2、安装完成后在src目录下的router文件下的index.js文件引入vue、vue-router以及你所用到的的组件

3、使用Vue.use();注册vue-router

4、配置路由

也可以在main.js中配置

1、引入vue-router

2、使用Vue.use()注册vue-router

3、引入你所需要的组件

4、配置路由

动态子路由配置

子路由的配置和上面的路由配置基本一样，既然叫做子路由那就是在父级路由的下面添加的了

在父路由下添加clildren:[]，然后在里面添加，:id（id可以随便起名，标识）这样就可以了

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

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

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

  2. vue的路由配置

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

  3. Vue结合路由配置递归实现菜单栏

    作者:小土豆biubiubiu 博客园:https://www.cnblogs.com/HouJiao/ 掘金:https://juejin.im/user/58c61b4361ff4b005d9e8 ...

  4. vue动态路由配置，vue路由传参

    动态路由: 当我们很多个页面或者组件都要被很多次重复利用的时候,我们的路由都指向同一个组件,这时候从不同组件进入一个"共用"的组件,并且还要传参数,渲染不同的数据 这就要用到动态路 ...

  5. vue入门全局配置

    全局配置 Vue.config 是一个对象,包含 Vue 的全局配置.可以在启动应用之前修改下列属性: silent 类型:boolean 默认值:false 用法: Vue.config.silen ...

  6. 【vue】路由配置

    一般组件我们会有全屏组件,或是在页面的某个部分显示组件,所以路由的第一层一般是全屏显示的,而在/目录下的组件为页面的某个部分显示的,通常需求是这样的,登录是全屏显示的,而普通页面是在页面的某个部分进行 ...

  7. vue - 详细路由配置

    1. 路由可配置多个 2. 路由包含嵌套子路由 3. 路由可以别名 4. 路由单独钩子 5. vue2.6.0(可以直接匹配大小写) export default new Router({ mode: ...

  8. Vue 路由懒加载， VueRouter一步完成Vue的路由懒加载 一行代码搞定懒加载

    Vue Router路由配置中的component里面配置即可 1 // 路由懒加载的方式加载组件 2 3 component: () => import('@/views/Detail'), ...

  9. 四、vue前端路由（轻松入门vue）

    轻松入门vue系列 Vue前端路由 七.Vue前端路由 1. 路由的基本概念与原理 后端路由 前端路由 实现简单的前端路由 vue-router基本概念 2. vue-router的基本使用 基本使用 ...

随机推荐

  1. 项目一:第十三天 1、菜单数据管理 2、权限数据管理 3、角色数据管理 4、用户数据管理 5、在realm中动态查询用户权限，角色 6、Shiro中整合ehcache缓存权限数据

    1 课程计划 菜单数据管理 权限数据管理 角色数据管理 用户数据管理 在realm中动态查询用户权限,角色 Shiro中整合ehcache缓存权限数据         2 菜单数据添加 2.1 使用c ...

  2. 算法Sedgewick第四版-第1章基础-018一解决不能声明泛型数组的两咱方法(强转或反射)

    1. /****************************************************************************** * Compilation: ja ...

  3. JavaScript-ES6中的class及继承

    我们知道,ES6中,引入了class这个关键字,让在JavaScript中定义类更加简单了 在介绍ES6中的class之前,我们先来看一下JavaScript之前类的实现,在此之前,JavaScrip ...

  4. 远程桌面--------ms12-020 漏洞复现 （死亡蓝屏）

    漏洞名:MS12-020(全称:Microsoft windows远程桌面协议RDP远程代码执行漏洞) 介绍:RDP协议是一个多通道的协议,让用户连上提供微软终端机服务的电脑. windows在处理某 ...

  5. IDEA内嵌Jetty启动SpringMvc项目

    这段时间本意是想要研究一下Netty的多线程异步NIO通讯框架,看完原理想要做下源码分析.查找资料发现Jetty框架底层支持用Netty做web请求的多线程分发处理,于是就筹备着将Jetty框架内嵌到 ...

  6. Android之悬浮窗口实现(WindowManager)

    工作中遇到一些项目需要把窗体显示在最上层,像来电弹窗显示电话号码等信息.拦截短信信息显示给用户或者游戏中实现声音的调节,我们想这些数据放在最上层,activity就满足不了我们的需求了,有些开发者使用 ...

  7. C#中virtual和abstract区别，举例子

    virtual和abstract都是用来修饰父类的,通过覆盖父类的定义,让子类重新定义. 它们有一个共同点:如果用来修饰方法,前面必须添加public,要不然就会出现编译错误:虚拟方法或抽象方法是不能 ...

  8. C#.Net使用正则表达式抓取百度百家文章列表

    工作之余,学习了一下正则表达式,鉴于实践是检验真理的唯一标准,于是便写了一个利用正则表达式抓取百度百家文章的例子,具体过程请看下面源码: 一:获取百度百家网页内容 public List<str ...

  9. NMS---非极大值抑制

    在物体检测中,NMS(Non-maximum suppression)应用十分广泛,其目的是为了消除多余的框,找到最佳的物体检测的位置.在RCNN系列算法中,会从一张图片中找出很多个候选框(可能包含物 ...

  10. docker常用命令行集锦

    对工作中用到的docker命令行进行一个汇总,方便以后的命令行查询,同时也为了加强记忆,会把工作中用到的命令,持续更新上 1.查看私有仓库都有哪些镜像 curl -X GET http://10.27 ...