vue2.0路由写法
// 0. 如果使用模块化机制编程,導入Vue和VueRouter,要调用 Vue.use(VueRouter) // 1. 定义(路由)组件。
// 可以从其他文件 import 进来
var Foo = {
template: '<div>foo</div>'
}
var Bar = {
template: '<div>bar</div>'
}
var x = require("A");
// 2. 定义路由
// 每个路由应该映射一个组件。 其中"component" 可以是
// 通过 Vue.extend() 创建的组件构造器,
// 或者,只是一个组件配置对象。
// 我们晚点再讨论嵌套路由。
var routes = [{
path: '/foo',
component: Foo
},
{
path: '/bar',
component: Bar
}
] // 3. 创建 router 实例,然后传 `routes` 配置
// 你还可以传别的配置参数, 不过先这么简单着吧。
var router = new VueRouter({
routes // (缩写)相当于 routes: routes
})
var app = new Vue({ el: "#app",
router
})
vue2.0路由写法的更多相关文章
- vue2.0路由写法、传参和嵌套
前置知识请戳这里 vue-routerCDN地址:https://unpkg.com/vue-router@3.0.1/dist/vue-router.js vue-router下载地址:https: ...
- vue2.0路由
现在用vue-cli搭建的环境里面vue-router是下载好的 vue2.0路由方式和以前也有些不同 没了了map和start方法 目录结构如上图 这里有三个文件,app.vue显示,main.js ...
- vue2.0路由-路由嵌套
vue一个重要的方面就是路由,下面是自己写的一个路由的例子: 1.引入依赖库就不必再说 2.创建组件 两种写法 第一种:间接 <template id="home"> ...
- vue2.0路由变化1
路由的步骤 1.定义组件 var Home={ template:'<h3>我是主页</h3>' }; var News={ template:'<h3>我是新闻& ...
- vue2.0路由进阶
一.路由的模式 第一种用history方式实现,HTML5使用window.history.pushState()实现路由的切换而不刷新页面. 第二种使用hash值的方式来实现. vue2.0两种都可 ...
- vue2.0 路由学习笔记
昨天温故了一下vue2.0的路由 做个笔记简单记录一下! 1.首相和vue1.0一样 要使用vuejs的路由功能需要先引入vue-router.js 2.然后修改原有a标签处代码 这里以一个ul li ...
- 解决vue2.0路由 TypeError: Cannot read property 'matched' of undefined 的错误问题
刚开始使用vue-router2.0,虽然也用了vux,用起来却发现一个问题--具体如下: 正常情况下使用脚手架跑完之后,然后修改源项目,首先在main.js入口里把该import进去的vuex,vu ...
- vue2.0路由切换后页面滚动位置不变BUG
最近项目中遇到这样一个问题,vue切换路由,页面到顶端的滚动距离仍会保持不变. 方法一: 监听路由 // app.vue export default { watch:{ '$route':func ...
- vue2.0 路由传参(router-link传过去)
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
随机推荐
- 类型转换 / BOOL 类型
/* Swift不允许隐式类型转换, 但可以使用显示类型转换(强制类型转换) OC: int intValue = 10; double doubleValue = (double)intValue; ...
- 把一个集合自定转成json字符串
List<CityData> listData =new List<CityData>(); //把一个集合自定转成json字符串. foreach (var city in ...
- CentOS 7 安装程序介绍
(一).引导菜单 使用 UEFI 引导 Install CentOS Linux 7 选择此选项开始在你的计算机系统中使用图形安装程序安装 CentOS 7 Test this media & ...
- java 字符串(String)常用技巧及自建方法模块汇总
1.String类常用方法汇总 (1)删除字符串的头尾空白符 public String trim() (2)从指定位置截取字符串 public String substring(int beginI ...
- 汉诺塔的python 动画演示
1.简介 古代有一座汉诺塔,塔内有3个座A.B.C,A座上有n个盘子,盘子大小不等,大的在下,小的在上,如图所示.有一个和尚想把这n个盘子从A座移到C座,但每次只能移动一个盘子,并且自移动过程中,3个 ...
- vSphere虚拟主机安装Centos7系统
经过上一帖的主机设置,这一步就可以开始安装系统了,本次详细记录各个过程并分析结果. Centos7 1.右键点击列表中的虚拟主机,打开控制台. 点击绿色开机键,开始安装. 这里有一个很关键的点,就是上 ...
- Hibernate中Query.list()方法报IllegalArgumentException异常
最近在使用Hibernate开发项目,在写好hql语句,并初始化Query对象,执行Query.list()方法时,应用报IllegalArgumentException异常.经网上查询,现已经基本决 ...
- 判断checkbox是否被选中
jquery判断checked的三种方法: .attr('checked): //看版本1.6+返回:”checked”或”undefined” ;1.5-返回:true或false .prop( ...
- Android版本信息及与Linux和Java的关系
1.Android与Linux和Java的关系 Android严格来说,不能算是Linux,Android是一个统称,具体来说,是Google用了Linux的一个核心,用这个核心来管理进程,控制硬件. ...
- 几种流行的开源WebService框架Axis1,Axis2,Xfire,CXF,JWS比较
几种流行的开源WebService框架Axis1,Axis2,Xfire,CXF,JWS比较 来源 XFire VS Axis XFire是与Axis2 并列的新一代WebService平台.之所 ...