概述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实现表格排序方法
Jun 14 Javascript
Javascript表格翻页效果的具体实现
Oct 05 Javascript
JavaScript中的值类型转换介绍
Dec 31 Javascript
jQuery中弹出iframe内嵌页面元素到父页面并全屏化的实例代码
Dec 27 Javascript
JS判断键盘是否按的回车键并触发指定按钮点击操作的方法
Feb 13 Javascript
JavaScript纯色二维码变成彩色二维码
Jul 23 Javascript
JavaScript实现一个简易的计算器实例代码
May 10 Javascript
Node.js中,在cmd界面,进入退出Node.js运行环境的方法
May 12 Javascript
AngularJS 事件发布机制
Aug 28 Javascript
vue中实现Monaco Editor自定义提示功能
Jul 05 Javascript
JS实现点星星消除小游戏
Mar 24 Javascript
React列表栏及购物车组件使用详解
Jun 28 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打造的tab选项卡效果代码(不用js)
2010/12/29 PHP
做了CDN获取用户真实IP的函数代码(PHP与Asp设置方式)
2013/04/13 PHP
PDO::getAttribute讲解
2019/01/28 PHP
JS验证控制输入中英文字节长度(input、textarea等)具体实例
2013/06/21 Javascript
利用jQuery简单实现产品展示图片左右滚动功能(示例代码)
2014/01/02 Javascript
父页面显示遮罩层弹出半透明状态的dialog
2014/03/04 Javascript
javaScript中两个等于号和三个等于号之间的区别介绍
2014/06/27 Javascript
JavaScript中的apply和call函数详解
2014/07/20 Javascript
JS小游戏之宇宙战机源码详解
2014/09/25 Javascript
关于延迟加载JavaScript
2015/05/05 Javascript
jQuery+Ajax+PHP+Mysql实现分页显示数据实例讲解
2015/09/27 Javascript
浅谈JSON.stringify()和JOSN.parse()方法的不同
2016/08/29 Javascript
JavaScript限定范围拖拽及自定义滚动条应用(3)
2017/05/17 Javascript
angularjs实现天气预报功能
2020/06/16 Javascript
JavaScript代码执行的先后顺序问题
2017/10/29 Javascript
vue组件父子间通信之综合练习(聊天室)
2017/11/07 Javascript
windows下更新npm和node的方法
2017/11/30 Javascript
vue中监听返回键问题
2019/08/28 Javascript
《javascript设计模式》学习笔记七:Javascript面向对象程序设计组合模式详解
2020/04/08 Javascript
[03:52]DOTA2英雄基础教程 酒仙
2013/12/23 DOTA
在Linux系统上通过uWSGI配置Nginx+Python环境的教程
2015/12/25 Python
基于Django contrib Comments 评论模块(详解)
2017/12/08 Python
使用python编写监听端
2018/04/12 Python
Python判断两个list是否是父子集关系的实例
2018/05/04 Python
Python中新式类与经典类的区别详析
2019/07/10 Python
css3新增颜色表示方式分享
2014/04/15 HTML / CSS
HTML5 新表单类型示例代码
2018/03/20 HTML / CSS
德国药房apodiscounter中文官网:德国排名前三的网上药店
2019/06/03 全球购物
数控专业个人求职信范例
2013/11/29 职场文书
社区工作者先进事迹
2014/01/18 职场文书
《口技》教学反思
2014/02/21 职场文书
计算机网络专业求职信
2014/06/05 职场文书
公证委托书标准格式
2014/09/11 职场文书
辞职信的写法
2015/02/27 职场文书
SpringRetry重试框架的具体使用
2021/07/25 Java/Android
NodeJs使用webpack打包项目的方法详解
2022/02/28 NodeJs