vue学习笔记之vue1.0和vue2.0的区别介绍


Posted in Javascript onMay 17, 2017

今天我们来说一说vue1.0和vue2.0的主要变化有哪些

一.在每个组件模板,不在支持片段代码

VUE1.0是: 

<template>
  <h3>我是组件</h3><strong>我是加粗标签</strong>
</template>

VUE2.0:必须有根元素,包裹住所有的代码

<template id="aaa">
  <div>
    <h3>我是组件</h3>
      <strong>我是加粗标签</strong>
   </div>
</template>

二.关于组件定义

VUE1.0定义组件的方式有:

Vue.extend            这种方式,在2.0里面有,但是有一些改动

Vue.component(组件名称,{  在2.0继续能用
  data(){}
  methods:{}
  template:
});

VUE2.0定义组件的方式则更为简单

var Home={
    template:''    ->  相当于Vue.extend()
};

三.生命周期的变化

vue1.0的生命周期为

init           ->初始化
created         ->创建
beforeCompile      ->编译之前
compiled         ->编译完成
ready    √      -> mounted
beforeDestroy      ->销毁之前
destroyed        ->已经销毁

vue2.0的生命周期为(标*的为经常用的)

beforeCreate  组件实例刚刚被创建,属性都没有
created     实例已经创建完成,属性已经绑定
beforeMount   模板编译之前
mounted     模板编译之后,代替之前ready *
beforeUpdate  组件更新之前
updated     组件更新完毕  *
beforeDestroy  组件销毁前
destroyed    组件销毁后

以上所述是小编给大家介绍的vue学习笔记之vue1.0和vue2.0的区别介绍,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
屏蔽F1~F12的快捷键的js函数
May 06 Javascript
js分解url参数(面向对象-极简主义法应用)
Aug 09 Javascript
Jquery获取和修改img的src值的方法
Feb 17 Javascript
jquery自动将form表单封装成json的具体实现
Mar 17 Javascript
jQuery中:not选择器用法实例
Dec 30 Javascript
AngularJs directive详解及示例代码
Sep 01 Javascript
微信小程序 action-sheet底部菜单详解
Oct 27 Javascript
微信小程序 picker-view 组件详解及简单实例
Jan 10 Javascript
JS实现一个简单的日历
Feb 22 Javascript
Node.JS更改Windows注册表Regedit的方法小结
Aug 18 Javascript
浅谈Koa2框架利用CORS完成跨域ajax请求
Mar 06 Javascript
Vuex实现简单购物车
Jan 10 Vue.js
Angular.JS中的this指向详解
May 17 #Javascript
websocket+node.js实现实时聊天系统问题咨询
May 17 #Javascript
JavaScript简单拖拽效果(1)
May 17 #Javascript
node.js连接MongoDB数据库的2种方法教程
May 17 #Javascript
JavaScript限定范围拖拽及自定义滚动条应用(3)
May 17 #Javascript
Vue.js鼠标悬浮更换图片功能
May 17 #Javascript
12个非常有用的JavaScript技巧
May 17 #Javascript
You might like
PHP的cURL库功能简介 抓取网页、POST数据及其他
2011/04/07 PHP
PHP学习之正则表达式
2011/04/17 PHP
ThinkPHP CURD方法之data方法详解
2014/06/18 PHP
ThinkPHP3.1新特性之内容解析输出详解
2014/06/19 PHP
CI框架整合smarty步骤详解
2016/05/19 PHP
支付宝服务窗API接口开发php版本
2016/07/20 PHP
PHP生成腾讯云COS接口需要的请求签名
2018/05/20 PHP
用javascript将数据库中的TEXT类型数据动态赋值到TEXTAREA中
2007/04/20 Javascript
js操作CheckBoxList实现全选/反选(在客服端完成)
2013/02/02 Javascript
js判断是否按下了Shift键的方法
2015/01/27 Javascript
Javascript设计模式之观察者模式(推荐)
2016/03/29 Javascript
值得分享的轻量级Bootstrap Table表格插件
2016/05/30 Javascript
js 弹出虚拟键盘修改密码的简单实例
2016/10/10 Javascript
详解如何在Angular中快速定位DOM元素
2017/05/17 Javascript
p5.js入门教程之平滑过渡(Easing)
2018/03/16 Javascript
ES6与CommonJS中的模块处理的区别
2018/06/13 Javascript
Vue+Node实现商品列表的分页、排序、筛选,添加购物车功能详解
2019/12/07 Javascript
javascript 设计模式之享元模式原理与应用详解
2020/04/08 Javascript
基于VSCode调试网页JavaScript代码过程详解
2020/07/20 Javascript
Django进阶之CSRF的解决
2018/08/01 Python
解决Djang2.0.1中的reverse导入失败的问题
2019/08/16 Python
解决python彩色螺旋线绘制引发的问题
2019/11/23 Python
Flask之pipenv虚拟环境的实现
2019/11/26 Python
python 图像的离散傅立叶变换实例
2020/01/02 Python
世界领先的26岁以下学生和青少年旅行预订网站:StudentUniverse
2018/07/01 全球购物
静态变量和实例变量的区别
2015/07/07 面试题
工程招投标邀请书
2014/01/26 职场文书
烹调加工管理制度
2014/02/04 职场文书
微笑面对生活演讲稿
2014/09/23 职场文书
2014年房产销售工作总结
2014/12/08 职场文书
初三学生语文考试作弊检讨书
2014/12/14 职场文书
保洁员岗位职责
2015/02/04 职场文书
哈姆雷特读书笔记
2015/06/29 职场文书
投诉信回复范文
2015/07/03 职场文书
创业计划书之养殖业
2019/10/11 职场文书
python操作xlsx格式文件并读取
2021/06/02 Python