vue入门----------路由配置
在使用脚手架搭建好项目后要配置路由
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入门----------路由配置的更多相关文章
- vue+element-ui路由配置相关
vue+element-ui路由配置相关 转自:http://www.cnblogs.com/MonaSong/p/6703804.html vue-router2中说明了,子路由前面可以不加'/', ...
- vue的路由配置
路由,其实就是指向的意思,当我点击页面上的home按钮时,页面中就要显示home的内容,如果点击页面上的about 按钮,页面中就要显示about 的内容.Home按钮 => home 内容, ...
- Vue结合路由配置递归实现菜单栏
作者:小土豆biubiubiu 博客园:https://www.cnblogs.com/HouJiao/ 掘金:https://juejin.im/user/58c61b4361ff4b005d9e8 ...
- vue动态路由配置,vue路由传参
动态路由: 当我们很多个页面或者组件都要被很多次重复利用的时候,我们的路由都指向同一个组件,这时候从不同组件进入一个"共用"的组件,并且还要传参数,渲染不同的数据 这就要用到动态路 ...
- vue入门全局配置
全局配置 Vue.config 是一个对象,包含 Vue 的全局配置.可以在启动应用之前修改下列属性: silent 类型:boolean 默认值:false 用法: Vue.config.silen ...
- 【vue】路由配置
一般组件我们会有全屏组件,或是在页面的某个部分显示组件,所以路由的第一层一般是全屏显示的,而在/目录下的组件为页面的某个部分显示的,通常需求是这样的,登录是全屏显示的,而普通页面是在页面的某个部分进行 ...
- vue - 详细路由配置
1. 路由可配置多个 2. 路由包含嵌套子路由 3. 路由可以别名 4. 路由单独钩子 5. vue2.6.0(可以直接匹配大小写) export default new Router({ mode: ...
- Vue 路由懒加载, VueRouter一步完成Vue的路由懒加载 一行代码搞定懒加载
Vue Router路由配置中的component里面配置即可 1 // 路由懒加载的方式加载组件 2 3 component: () => import('@/views/Detail'), ...
- 四、vue前端路由(轻松入门vue)
轻松入门vue系列 Vue前端路由 七.Vue前端路由 1. 路由的基本概念与原理 后端路由 前端路由 实现简单的前端路由 vue-router基本概念 2. vue-router的基本使用 基本使用 ...
随机推荐
- javascript 函数,事件
1.函数字符串函数 var s=new string(); var ss="hello world"; var sss=""HELLO, WORLD" ...
- Struts第三天
OgnlValueStack贯穿整个 Action 的生命周期. 它是ContextMap中的一部分,里面的结构是一个List,是我们可以快速访问数据一个容器.它的封装是由struts2框架完成的. ...
- rvm 安装后的补充工作:source $HOME/.profile
rvm安装后会在 $HOME/.bash_profile 文件追加一行代码: [[ -s "$HOME/.rvm/scripts/rvm" ]] && source ...
- 数字图像处理实验(2):PROJECT 02-02, Reducing the Number of Gray Levels in an Image 标签: 图像处理MATLAB 2017-
实验要求: Reducing the Number of Gray Levels in an Image Objective To understand how the number of gray ...
- loj2395 [JOISC 2017 Day 2]火车旅行
传送门 分析 我们知道无论往左走还是往右走一定都是往不低于这个点的地方走 于是我们可以考虑用倍增来维护一个点向左和向右走$2^i$最远分别能走到哪里 我们可以先用单调栈求出直走一步的情况,之后再处理倍 ...
- php数据连接
<?php header("Content-type: text/html;charset=utf-8");//设置编码格式为UTF-8 error_reporting(E_ ...
- lua遍历文件
看了不少人的,主要还是错误处理有点问题,不多说了 贴代码: require "lfs" function getpathes(rootpath, pathes) pathes = ...
- 使用cydia substrate 来进行android native hook
cydia不仅可以hook java代码,同样可以hook native代码,下面举一个例子来进行android native hook 我是在网上找到的supermathhook这个项目,在他基 ...
- Java为何这么难学?
在学校的时候,就开始接触Java,哪个时候学的是基础的语法.毕业之后,由于没有找到实习工作且没有从事Java开发,慢慢的就把Java给丢了.从学校出来的几个同事,有的进入了项目实施行业,做了项 目经理 ...
- UWP&WP8.1 附加属性 和WebView的NavigateToString方法XAML绑定方法
附加属性,即为添加一个没有的属性的. 使用方法和依赖属性相似,个人理解就是特殊形式的依赖属性. 经常的用处,以一个简单的来说,比如一个控件的某一个属性我们想在XAML中给其绑定数据.但是我们在XAML ...