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

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. 02 mybatis环境搭建 【spring + mybatis】

    1 导包 <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.o ...

  2. Luogu 3939 数颜色

    随手点开一个题. 咦,这不是裸的动态开点线段树吗?写一个写一个…… Code: #include <cstdio> #include <cstring> using names ...

  3. linux设备驱动第四篇：驱动调试方法

    http://www.cnblogs.com/donghuizaixian/archive/2015/04/02/4387083.html 上一篇我们大概聊了如何写一个简单的字符设备驱动,我们不是神, ...

  4. Linux-shell实现阳历转农历(序)

    好些天没有登陆邮箱,前几天上班打开一看垃圾箱中有一封邮件让我好激动,还是国外友人的英文邮件.^_^大概内容是我早些时候写的一个阳历转农历的shell小程序,他在用的时候发现了bug,但是这个bug我在 ...

  5. python基本概念——字符串

    1.字符串 一个字符串用什么引号开头,就必须用什么引号结尾.两上三引号之间的一切都作为字符串的内容,对应的单引号与双引号却只能创建单行字符串. 2.转义符 \,行末的单独一个反斜杠表示字符串在下一行继 ...

  6. Android二维码扫描功能的集成开发

    二维码开发主要依赖ZXing开源项目 项目地址:https://github.com/zxing/zxing 这个开源项目可以扫描一维,和二维码, 一维码指的是书后面的条形码 首先配置ZXing库和A ...

  7. python 常用的一些库

    AllPairs 2.0.1Appium-Python-Client 0.24asn1crypto 0.24.0attrs 17.4.0AutoItLibrary 1.1bcrypt 3.1.4bea ...

  8. GUID介绍

    GUID介绍 GUID(Global unique identifier)全局唯一标识符,它是由网卡上的标识数字(每个网卡都有唯一的标识号)以及 CPU 时钟的唯一数字生成的的一个 16 字节的二进制 ...

  9. 一键结束port 5037占用

    输入cmd进入dos界面,进入android-sdk-windows\platform-tools目录,执行下面命令启动adb start-server出现下面错误* daemon not runni ...

  10. iOS模拟器录屏转gif神器

    我发现苹果的Quick Time Player用来录屏就挺好用的.打开后选择 文件 - 新建屏幕录制 - 点击录制按钮, 划出要录制的模拟器窗体 - 点击录制就可以了. 录制成mov格式还要再转成gi ...