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

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. 常用linux配置文件

    /etc/hosts:用户IP与域名的对应解析表/etc/sysconfig/network:机器名.网卡启动.网关等配置/etc/fstab:记录开机自动挂载的文件系统/etc/rc.local:开 ...

  2. Angular07 利用angular打造管理系统页面

    1 创建一个新的angular应用 ng new adminSystem 2 利用WebStorm打开adminSystem应用 3 借助AdminLTE这个开源项目来辅助开发 AdminLTE项目: ...

  3. Python_pip_02_利用pip安装模块(以安装pyperclip为例)

    >任务:利用pip安装pyperclip模块 >前提 你已经在你的电脑里面安装啦Python2.7的Windows版本,并且已经配置了环境变量 >实现步骤 >>打开你的P ...

  4. Spring 已看 没用

    注解 @Autwired 依赖注入  作用: 自动按照类型注入.当使用注解注入属性时,set方法可以省略.它只能注入其他bean类型.当有多个类型匹配时,使用要注入的对象变量名称作为bean的id,在 ...

  5. ROS Learning-007 beginner_Tutorials ROS节点

    ROS Indigo beginner_Tutorials-06 ROS节点 我使用的虚拟机软件:VMware Workstation 11 使用的Ubuntu系统:Ubuntu 14.04.4 LT ...

  6. Python 黑客 --- 001 UNIX口令破解机

    Python 黑客 实战:UNIX口令破解机 使用的系统:Ubuntu 14.04 LTS Python语言版本:Python 2.7.10 V crypt 库是Python内置的库.在UNIX系统使 ...

  7. bzoj2134 错选单位

    传送门 题目 Input n很大,为了避免读入耗时太多, 输入文件只有5个整数参数n, A, B, C, a1, 由上交的程序产生数列a. 下面给出pascal/C/C++的读入语句和产生序列的语句( ...

  8. java全栈day01-03注释、关键字与标识符

    通常我们需要在源代码中添加文字用来对进行代码解释说明,但这些文字并不是Java代码的语法,会导致编译出错.这时我们可以使用注释来完成这一事项! 在编译时,编译器会忽略注释的存在,就好像注释内容不存在一 ...

  9. 使用Spring加载properties配置文件.md

    背景 类似于datasource.properties之类的配置文件,最初通过Java的Properties类进行处理.这种方式有许多弊端,如每次都需要读取配置文件:若将Properties作为成员变 ...

  10. Ubuntu 如何为 XMind 添加快速启动方式和图标

    目录 Ubuntu 如何为 XMind 添加快速启动方式和图标 Ubuntu 如何为 XMind 添加快速启动方式和图标 按照教程Ubuntu16.04LTS安装XMind8并创建运行图标进行Xmin ...