VUE2.0不可忽视的很多变化
今天使用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
vue2.0中文官方文档已发布:http://vuefe.cn/guide/
1.目前的项目几乎每个页面都用到了1.0的ready钩子函数,然而2.0已废弃不用,进而使用mounted替换,同时还新增了beforeMount、beforeUpdate、updated等,私以为越来越向react看齐了有木有。。
beforeUpdate的作用是在页面初始渲染视图之后,一旦监测到data发生变化,在变化的数据重新渲染视图之前会触发beforeUpdated钩子函数,这也是重新渲染之前最后修改数据的机会
update的作用则是在data发生变化渲染更新视图之后触发。
2.同时废弃的还有events、$dispatch、$broadcast,官方推荐使用vuex或者全局的事件驱动,然而废弃的这些方法在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也已不支持使用,trackby被key属性替换。
6.自定义组件中的partial,弃用,这个一直没用到
7.新增 v-once指令
8.新增 propsData
9.新增 render
VUE2.0不可忽视的很多变化的更多相关文章
- vue2.0有哪些变化
vue2.0之后有哪些变化: 1.每个组件模板template,不再支持片段代码 之前: <template> <h3>vue-router+vue-loader</h3 ...
- Vue2.0实现1.0的搜索过滤器功能
Vue2.0删除了很多1.0的比较实用的过滤器,如filterBy,orderBy.官方文档给了通过计算属性实现1.0搜索过滤器功能,自己又加入了大小写通用检索功能,比较简单,学一下. <bod ...
- vue2.0变化
之前有很多的vue知识总结都是围绕1.0版本实现的,下面主要总结一下2.0相对于1.0的一些变化. 组件定义 在vue1.0中,我们有使用vue.extend()来创建组件构造器继而创建组件实例,如下 ...
- Vue2.0以后,有哪些变化
最近移动端项目版本升级,Vue由之前的1.0升级到2.3,那么,Vue2.0之后,有哪些细节的变化呢,现在总结如下: 1.在每个组件模板,不再支持片段代码 组件中模板: 之前: <templat ...
- Vue2.0的变化 ,组件模板,生命周期,循环,自定义键盘指令,过滤器
组件模板: 之前: <template> <h3>我是组件</h3><strong>我是加粗标签</strong> </templat ...
- Vue2.0中v-for迭代语法变化(key、index)【转】
转自:http://blog.csdn.net/sinat_35512245/article/details/53966788 Vue2.0的代码中发现 $key这个值并不能渲染成功,问题如下:但是v ...
- 【重点突破】—— Vue1.0到Vue2.0的变化
前言: 本文参考作者:_So_ 和 我是某慧 的博文,重点梳理Vue1.0升级到Vue2.0后在开发中要注意的不同,以做学习. 组件模板不再支持片段代码,必须有一个顶级元素包裹,例如: ...
- vue2.0路由变化1
路由的步骤 1.定义组件 var Home={ template:'<h3>我是主页</h3>' }; var News={ template:'<h3>我是新闻& ...
- vue2.0构建淘票票webapp
项目描述 之前一直用vue1.x写项目,最近为了过渡到vue2.0,特易用vue2.0栈仿写了淘票票页面,而且加入了express作为后台服务. 前端技术栈:vue2.0 + vue-router + ...
随机推荐
- 可在广域网部署运行的QQ高仿版 -- GG叽叽V2.4,增加远程协助、桌面共享功能(源码)
QQ的远程协助.或者说桌面共享是一个非常实用的功能,所以,2.4版本的GG复制了它,而且,GG增强了桌面共享的功能,它可以允许指定要共享桌面的区域,这样,对方就只能看到指定区域的桌面,这对节省流量会非 ...
- UWP?UWP! - Build 2015有些啥?(1)
UWP?UWP! - Build 2015有些啥? Build 2015圆满落幕了,不知大家有多少人刷夜看了直播呢?不管怎么说,想必各位都很好奇在这场微软开发者盛宴上,Microsoft又发布了什么令 ...
- Java IO8:IO简单总结
字节流.字符流继承关系 前几篇文章讲解了字节流.字符流的使用,不过Java提供给用户的流类远不止此,限于篇幅原因,没办法一一讲解,而且也没有必要一一讲解,就像我在写博客的时候多次提到的,有问题的时候学 ...
- Ubuntu Desktop安装及桌面美化(修复图片)
Ubuntu Desktop安装及桌面美化 1 开篇概述 本 系统的文章主要是讲互联网方向的开发主题.根据目前主流互联网公司的技术架构,Linux是必不可少的.对于一直习惯于在Windows下工作 ...
- Intellij修改archetype Plugin配置
Maven archetype plugin为我们提供了方便的创建 project功能,Archtype指我们项目的骨架,作为项目的脚手架. 如fornt end的yo之类.我们能够通过简单的一行控制 ...
- JavaScript思维导图—数组
JavaScript思维导图-来自@王子墨http://julying.com/blog/the-features-of-javascript-language-summary-maps/
- Facebook 发布「流程」
时不时就会在面试过程中碰到有候选人问 Facebook 是否采用 Scrum 之类的敏捷方法,偶尔也会有中国的朋友问及 Facebook 上线流程.我通常会简单说几句,然后说「如果你真感兴趣的话,去搜 ...
- ActiveMQ第六弹:设置多个并行的消费者
消息队列本来就是一种经典的生产者与消费者模式.生产者向消息队列中发送消息,消费者从消息队列中获取消息来消费. 消息的传送一般由一个代理来实现的,那就是Message broker(即消息代理).Mes ...
- JMS确认机制
JMS中为数不多的重点就是消息的确认机制,下面分别介绍J2EE和Spring的MessageListenerContainer的确认机制 J2EE中JMS确认机制 在JMS规范中一共4种确认方式 AU ...
- 为什么说Java中的随机数都是伪随机数?
什么是伪随机数? 1.伪随机数是看似随机实质是固定的周期性序列,也就是有规则的随机. 2.只要这个随机数是由确定算法生成的,那就是伪随机,只能通过不断算法优化,使你的随机数更接近随机. (随机这 ...