vue.js路由学习笔记
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.js"></script>
<script src="https://cdn.bootcss.com/vue-router/2.0.1/vue-router.js"></script>
</head>
<body>
<div id ="app">
<div>
<router-link to="/home">主页</router-link>
<router-link to="/news">新闻</router-link>
</div>
<div>
<router-view></router-view>
</div> </div> </body>
<script>
var Home={
template:'<h3>我是主页</h3>'
};
var News={
template:'<h3>我是新闻</h3>'
}; var router =new VueRouter({
routes :[
{path:'/home',component:Home},
{path:'/news',component:News},
] }); new Vue({
router,
el:'#app' });
</script>
</html>
特别注意版本,之前学习时候是2.0.1,后来改了版本,发觉不可以i用了,等过几天进行更新下学习下
vue.js路由学习笔记的更多相关文章
- vue.js路由学习笔记二
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- 两万字Vue.js基础学习笔记
Vue.js学习笔记 目录 Vue.js学习笔记 ES6语法 1.不一样的变量声明:const和let 2.模板字符串 3.箭头函数(Arrow Functions) 4. 函数的参数默认值 5.Sp ...
- 从零开始学习Vue.js，学习笔记
一.为什么学习vue.js methods 只有纯粹的数据逻辑,而不是去处理 DOM 事件细节. vue.js兼具angular.js和react的优点,并且剔除了他们的缺点 官网:http://cn ...
- 两万字Vue.js基础学习笔记（二）
Vue.js学习笔记(二) 4.模块化开发 ES6模块化的导入和导出 我们使用export指令导出了模块对外提供的接口,下面我们就可以通过import命令来加载对应的这个模块了 首先,我们需要在HTM ...
- vue.js初始学习笔记&vue-cli
笔记一下: vue.js 安装,参考: http://www.cnblogs.com/wisewrong/p/6255817.html (vue-cli) http://www.cnblogs.com ...
- Vue.js实战学习笔记（中）
1.递归组件给组件设置name属性,组件就可以在它的模板内调用自己,但必须给一个条件来限制递归数量.<div id="app"> <child-component ...
- vue.js 源代码学习笔记 ----- html-parse.js
/** * Not type-checking this file because it's mostly vendor code. */ /*! * HTML Parser By John Resi ...
- vue.js 源代码学习笔记 ----- 工具方法 lang
/* @flow */ // Object.freeze 使得这个对象不能增加属性, 修改属性, 这样就保证了这个对象在任何时候都是空的 export const emptyObject = Obje ...
- vue.js 源代码学习笔记 ----- 工具方法 env
/* @flow */ /* globals MutationObserver */ import { noop } from 'shared/util' // can we use __proto_ ...
随机推荐
- Eloquent ORM模型中添加自定义值
我们都知道通过Laravel中数据库查询出来的模型对象都是基于数据库字段,今天给大家展示一个 Laravel Eloquent ORM 模型特性-附加值不存在于数据表中. 举个简单的栗子,一篇文章(p ...
- LAMP 3.1 mysql的root密码重置
给mysql设置密码 /usr/local/mysql/bin/mysql -uroot 可以直接登录mysql 设置密码 /usr/local/mysql/bin/mysqladmin -uroot ...
- JAVA之数组队列
package xxj.datastructure0810; import java.util.Random; public class DataStructure { /** * @param ar ...
- 数据存储的两种方式：Cookie 和Web Storage（转）
数据存储的两种方式:Cookie 和Web Storage 数据存储的两种方式:Cookie 和Web Storage 1.Cookie Cookie的作用就像你去超市购物时,第一次给你办张购物卡 ...
- Ros指令集
rospack = ros+pack(age) : provides information related to ROS packages rosstack = ros+stack : provid ...
- ps和ai的一些认识
ps主要是一个后期软件,它很大程度上不是一个创作型的软件,这是它的定位.我觉得李涛老师那句话说的很好,ps是对已有的素材进行加工的.这个已有的素材来源包括但不限于拍照.扫描.数绘板.下载的.如果说你想 ...
- 3D立体菜单导航
今天在微博里面看到别人分享的一个立体效果,我觉得挺好的,就拿下来自己存着,万一以后用到. 效果如下: index.html <!DOCTYPE html> <html > &l ...
- LeetCode第617题：合并二叉树
问题描述 解题思路 略略略略略 C++代码 /** * Definition for a binary tree node. * struct TreeNode { * int val; * Tree ...
- java全栈day05--ArrayList的基本功能
在前面我们学习了数组,数组可以保存多个元素,但在某些情况下无法确定到底要保存多少个元素,此时数组将不再适用,因为数组的长度不可变.例如,要保存一个学校的学生,由于不停有新生来报道,同时也有学生毕业离开 ...
- Java Annotation详解
元数据的作用 如果要对于元数据的作用进行分类,目前还没有明确的定义,不过我们可以根据它所起的作用,大致可分为三类: l 编写文档:通过代码里标识的元数据生成文档. l ...