概述VUE2.0不可忽视的很多变化


Posted in Javascript onSeptember 25, 2016

今天使用webpack-sample初始一个vue-cli项目,在app.vue文件中添加了个钩子函数ready,可是ready内的事件一直不执行,检查了webpack文件和package.json也没发现什么问题,浏览器也没报错或者提示,很令人捉急。然后去github看了webpack-simple源码,才发现原来vue init webpack-simple默认安装的vue是2.0版本。马上推测到是不是因为vue2.0废弃了ready的用法,果然不出所料,我真是太机智了。看了下vue2.0的英文的英文文档,发现相对于vue1.0有很多变化,而且变化不是一般的大。。。。如果一旦项目要升级到vue2.0,那么很多页面要整改,很多组件都不能用了,所以目前的项目打死不能升级。可以通过vue init webpack-simple#1.0安装基于vue1.0版本的vue-cli。

下边来分析下vue2.0几个重要的与自己目前项目相关的变化,纯粹是个人理解,权当了解,详细英文文档在此https://github.com/vuejs/vue/issues/2873

1.目前的项目几乎每个页面都用到了1.0的ready钩子函数,然而2.0已废弃不用,进而使用mounted替换,同时还新增了beforeMount、beforMount、beforeUpdate、updated等,私以为越来越向react看齐了有木有。。

2.同时废弃的还有events、$dispatch、$broadcast,官方推荐使用vuex或者全局的event bus(event bus是什么,新手一枚,不是很明白),然而废弃的这些方法在vux UI框架中很多地方都有使用,无疑在项目中用到它的地方在2.0版本都会不起作用,甚至会报错。

3.v-ref、v-el 弃用 统一使用ref属性为元素或组件添加标记,然后通过this.$refs获取

例如<p ref="a"></p> 获取方法为this.$refs.a 对于自定义组件同样适用

4.$els 是用来获取元素DOM对象,这个也废弃不用,$refs可以起到替代性作用。

5.v-for循环中常用的$index、$key也已不支持使用

6.自定义组件中的partial,弃用,这个一直没用到

7.新增 v-once指令

8.新增 propsData

9.新增 render

以上所述是小编给大家介绍的VUE2.0不可忽视的很多变化 ,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript 播放器 控制
Jan 22 Javascript
用showModalDialog弹出页面后,提交表单总是弹出一个新窗口
Jul 18 Javascript
JavaScript 判断用户输入的邮箱及手机格式是否正确
Dec 08 Javascript
js实现两点之间画线的方法
May 12 Javascript
jQuery 自定义下拉框(DropDown)附源码下载
Jul 22 Javascript
微信小程序 wxapp导航 navigator详解
Oct 31 Javascript
微信小程序 中wx.chooseAddress(OBJECT)实例详解
Mar 31 Javascript
深入理解React中何时使用箭头函数
Aug 23 Javascript
安装Node.js并启动本地服务的操作教程
May 12 Javascript
vue+webpack 更换主题N种方案优劣分析
Oct 28 Javascript
基于vue的tab-list类目切换商品列表组件的示例代码
Feb 14 Javascript
原生JS实现拖拽功能
Dec 16 Javascript
微信小程序前端源码逻辑和工作流
Sep 25 #Javascript
BootStrap 超链接变按钮的实现方法
Sep 25 #Javascript
原生JS实现网络彩票投注效果
Sep 25 #Javascript
JavaScript实现url参数转成json形式
Sep 25 #Javascript
动态JavaScript所造成一些你不知道的危害
Sep 25 #Javascript
jQuery中的AjaxSubmit使用讲解
Sep 25 #Javascript
需要牢记的JavaScript基础知识
Sep 25 #Javascript
You might like
php 函数使用方法与函数定义方法
2010/05/09 PHP
PHP中使用gettext来支持多语言的方法
2011/05/02 PHP
Zend Framework教程之Autoloading用法详解
2016/03/08 PHP
PHP正则匹配反斜杠'\'和美元'$'的方法
2017/02/08 PHP
javascript 放大镜效果js组件 qsoft.PopBigImage.v0.35 加入了chrome支持
2009/04/07 Javascript
jQuery 淡出一个图像到另一个图像的实现代码
2013/06/12 Javascript
jQuery中:enabled选择器用法实例
2015/01/04 Javascript
JavaScript中数据结构与算法(五):经典KMP算法
2015/06/19 Javascript
JavaScript入门教程之引用类型
2016/05/04 Javascript
jQuery 获取多选框的值及多选框中文的函数
2016/05/16 Javascript
Bootstrap Table使用方法解析
2016/10/19 Javascript
如何正确理解javascript的模块化
2017/03/02 Javascript
ES6正则表达式的一些新功能总结
2017/05/09 Javascript
详解vue.js 开发环境搭建最简单攻略
2017/06/12 Javascript
vue mixins组件复用的几种方式(小结)
2017/09/06 Javascript
javascript算法之二叉搜索树的示例代码
2017/09/12 Javascript
详解使用jest对vue项目进行单元测试
2018/09/07 Javascript
ES5和ES6中类的区别总结
2020/12/21 Javascript
详解Python自建logging模块
2018/01/29 Python
python多线程并发实例及其优化
2019/06/27 Python
pycharm 批量修改变量名称的方法
2019/08/01 Python
python3 求约数的实例
2019/12/05 Python
使用css如何制作时间ICON方法实践
2012/11/12 HTML / CSS
法国一家芭蕾舞鞋公司:Repetto
2018/11/12 全球购物
Carter’s OshKosh加拿大:购买婴幼儿服装和童装
2018/11/27 全球购物
梅西百货官网:Macy’s
2020/08/04 全球购物
企业行政文员岗位职责
2013/12/03 职场文书
初中高效课堂实施方案
2014/02/26 职场文书
节能环保口号
2014/06/12 职场文书
班级团队活动方案
2014/08/14 职场文书
公司离职证明标准格式
2014/11/18 职场文书
2015年学生会主席工作总结
2015/04/21 职场文书
七一慰问简报
2015/07/20 职场文书
2015中秋节晚会开场白
2015/07/30 职场文书
小学中队长竞选稿
2015/11/20 职场文书
Mysql的Table doesn't exist问题及解决
2022/12/24 MySQL