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 相关文章推荐
对textarea框的代码调试,而且功能上使用非常方便,酷
Jun 30 Javascript
My Desktop :) 桌面式代码
Dec 29 Javascript
js中使用DOM复制(克隆)指定节点名数据到新的XML文件中的代码
Jul 27 Javascript
jquery下checked取值问题的解决方法
Aug 09 Javascript
JS使用replace()方法和正则表达式进行字符串的搜索与替换实例
Apr 10 Javascript
javascript中setTimeout和setInterval的unref()和ref()用法示例
Nov 26 Javascript
AngularJS入门知识之MVW类框架的编程思想探讨
Dec 08 Javascript
JS模拟Dialog弹出浮动框效果代码
Oct 16 Javascript
Jquery zTree 树控件异步加载操作
Feb 25 Javascript
手动用webpack搭建第一个ReactApp的示例
Apr 11 Javascript
js中call()和apply()改变指针问题的讲解
Jan 17 Javascript
layer.js open 隐藏滚动条的例子
Sep 05 Javascript
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留言本实例代码
2010/05/09 PHP
php开发留言板的CRUD(增,删,改,查)操作
2012/04/19 PHP
如何使用FireFox插件FirePHP调试PHP
2013/07/23 PHP
php版小黄鸡simsimi聊天机器人接口分享
2014/01/26 PHP
PHP中substr_count()函数获取子字符串出现次数的方法
2016/01/07 PHP
[原创]解决wincache不支持64位PHP5.5/5.6的问题(提供64位wincache下载)
2016/06/22 PHP
PHP + plupload.js实现多图上传并显示进度条加删除实例代码
2017/03/06 PHP
php经典趣味算法实例代码
2020/01/21 PHP
基于jquery点击自以外任意处,关闭自身的代码
2012/02/10 Javascript
密码强度检测效果实现原理与代码
2013/01/04 Javascript
js+css 实现遮罩居中弹出层(随浏览器窗口滚动条滚动)
2013/12/11 Javascript
Jquery树插件zTree用法入门教程
2015/02/17 Javascript
在JavaScript中处理时间之setMinutes()方法的使用
2015/06/11 Javascript
jQuery下拉美化搜索表单效果代码分享
2015/08/25 Javascript
深入浅析JavaScript中的作用域和上下文
2016/03/26 Javascript
基于JS模仿windows文件按名称排序效果
2016/06/29 Javascript
浅谈JS中json数据的处理
2016/06/30 Javascript
简洁实用的BootStrap jQuery手风琴插件
2016/08/31 Javascript
Angular实现的table表格排序功能完整示例
2017/12/22 Javascript
Angular路由ui-router配置详解
2018/08/01 Javascript
webpack+vue-cli项目中引入外部非模块格式js的方法
2018/09/28 Javascript
Vuex的初探与实战小结
2018/11/26 Javascript
解决layui checkbox 提交多个值的问题
2019/09/02 Javascript
详解JavaScript之ES5的继承
2020/07/08 Javascript
解决Vue中的生命周期beforeDestory不触发的问题
2020/07/21 Javascript
python数据库操作常用功能使用详解(创建表/插入数据/获取数据)
2013/12/06 Python
PyQt5 实现给窗口设置背景图片的方法
2019/06/13 Python
pymysql模块的操作实例
2019/12/17 Python
Pytorch 高效使用GPU的操作
2020/06/27 Python
canvas学习笔记之2d画布基础的实现
2019/02/21 HTML / CSS
使用html5新特性轻松监听任何App自带返回键的示例
2018/03/13 HTML / CSS
护理专业优质毕业生自荐书
2014/01/31 职场文书
机电专业大学生职业规划书范文
2014/02/25 职场文书
工程索赔意向书
2014/08/30 职场文书
政风行风建设整改方案
2014/10/27 职场文书
Docker安装MySql8并远程访问的实现
2022/07/07 Servers