概述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 相关文章推荐
jquery中的$(document).ready()使用小结
Feb 14 Javascript
js 判断图片是否加载完以及实现图片的预下载
Aug 14 Javascript
JavaScript必知必会(三) String .的方法来自何方
Jun 08 Javascript
Bootstrap基本插件学习笔记之折叠(22)
Dec 08 Javascript
JavaScript 栈的详解及实例代码
Jan 22 Javascript
JS实现汉字与Unicode码相互转换的方法详解
Apr 28 Javascript
使用vue-cli创建项目的图文教程(新手入门篇)
May 02 Javascript
微信小程序视图容器(swiper)组件创建轮播图
Jun 19 Javascript
简单两步使用node发送qq邮件的方法
Mar 01 Javascript
vue模仿网易云音乐的单页面应用
Apr 24 Javascript
Vue 解决路由过渡动画抖动问题(实例详解)
Jan 05 Javascript
js实现简单抽奖功能
Nov 24 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
关于拼配咖啡,你要知道
2021/03/03 咖啡文化
提取HTML标签
2006/10/09 PHP
php empty函数 使用说明
2009/08/10 PHP
关于初学PHP时的知识积累总结
2013/06/07 PHP
php接口和抽象类使用示例详解
2014/03/02 PHP
PHP英文字母大小写转换函数小结
2014/05/03 PHP
phpstorm编辑器乱码问题解决
2014/12/01 PHP
详解PHP对数组的定义以及数组的创建方法
2015/11/27 PHP
PHP保存session到memcache服务器的方法
2016/01/19 PHP
ThinkPHP框架结合Ajax实现用户名校验功能示例
2019/07/03 PHP
redis+php实现微博(三)微博列表功能详解
2019/09/23 PHP
laravel 输出最后执行sql 附:whereIn的使用方法
2019/10/10 PHP
js动态设置鼠标事件示例代码
2013/10/30 Javascript
JavaScript鼠标事件,点击鼠标右键,弹出div的简单实例
2016/08/03 Javascript
Nodejs 搭建简单的Web服务器详解及实例
2016/11/30 NodeJs
jquery 判断是否支持Placeholder属性的方法
2017/02/07 Javascript
Angular实现点击按钮后在上方显示输入内容的方法
2017/12/27 Javascript
JS检索下拉列表框中被选项目的索引号(selectedIndex)
2019/12/17 Javascript
Vue实现计算器计算效果
2020/08/17 Javascript
PHP魔术方法__ISSET、__UNSET使用实例
2014/11/25 Python
Python使用Matplotlib实现Logos设计代码
2017/12/25 Python
Python面向对象程序设计OOP入门教程【类,实例,继承,重载等】
2019/01/05 Python
使用python PIL库实现简单验证码的去噪方法步骤
2019/05/10 Python
用OpenCV将视频分解成单帧图片,图片合成视频示例
2019/12/10 Python
python与c语言的语法有哪些不一样的
2020/09/13 Python
让IE支持HTML5的方法
2012/12/11 HTML / CSS
Lands’ End官网:经典的美国生活方式品牌
2016/08/14 全球购物
国贸专业的职业规划范文
2014/01/23 职场文书
策划创业计划书
2014/02/06 职场文书
售后求职信范文
2014/03/15 职场文书
再婚婚前财产协议书范本
2014/10/19 职场文书
消防演习感想
2015/08/10 职场文书
卫生主题班会
2015/08/14 职场文书
五年级作文之劳动作文
2019/11/12 职场文书
python爬取新闻门户网站的示例
2021/04/25 Python
mysql 索引的数据结构为什么要采用B+树
2022/04/26 MySQL