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> ...
随机推荐
- 根据域名获取ip地址gethostbyname
#include <sys/socket.h> #include <stdio.h> #include <netdb.h> int main(int argc, c ...
- springboot(十三)-分库分表-手动配置
sharding-jdbc简介 Sharding-JDBC直接封装JDBC API,可以理解为增强版的JDBC驱动,旧代码迁移成本几乎为零: 可适用于任何基于java的ORM框架,如:JPA, Hib ...
- 【Ubuntu】执行定时任务(cron)
1.打开定时任务配置文件 crontab -e 2.编写定时任务时间 命令和脚本例如: /3 * * * * /soft/config/test.sh 前5个字段为时间,后面的一个为命令 前5个含义为 ...
- C# 委托进阶
本文参考自:https://wenku.baidu.com/view/41ab91d3c1c708a1284a44d7.html?qq-pf-to=pcqq.c2c 1.为什么委托定义的返回值通常为v ...
- PHPStorm操作小技巧
1.围绕选中字符输入引号或者括号 2.设置服务器部署 3.隐藏Project快捷键 Shift + Esc 4.IDE内窗口切换 Ctrl + TAB 5.关闭当前项目 File -> Clos ...
- PHP 删除 数组 指定成员
1. unset删除某一个 特定成员 $arr[] = ; $arr[] = ; $arr[] = ; ]); var_dump($arr); array() { []=> ) []=> ...
- 【数组】Unique Paths II
题目: Follow up for "Unique Paths": Now consider if some obstacles are added to the grids. H ...
- Oracle练习笔记
1 基本查询 SQL> --当前用户 SQL> show user USER 为 "SCOTT" SQL> --当前用户下的表 SQL> select * ...
- Hadoop Gateway 部署
1.集群的 hadoop-current hive-current spark-current copy 到 gateway 机器 2.集群的 hadoop-conf hive-conf ...
- SpringMVC 的工作机制
在一个工程中如果想要使用 SpringMVC的话,只需要两个步骤 在web.xml中配置一个DispatcherServlet.需要配置一个org.springframework.web.servle ...