这篇文章主要介绍vue1.0与2.0有哪些区别,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!
Vue.js是一个构建数据驱动的 web 界面的渐进式框架。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。它不仅易于上手,还便于与第三方库或既有项目整合。
一、生命周期
1、1.0的生命周期:
周期 | 解释 |
---|---|
init | 组件刚刚被创建,但Data、method等属性还没被计算出来 |
created | 组件创建已经完成,但DOM还没被生成出来 |
beforeCompile | 模板编译之前 |
compiled | 模板编译之后 |
ready | 组件准备(平时用得较多) |
attached | 在 vm.$el 插入到DOM时调用 |
detached | 在 vm.$el 从 DOM 中删除时调用 |
beforeDestory | 组件销毁之前 |
destoryed | 组件销毁之后 |
2、2.0的生命周期
周期 | 解释 |
---|---|
beforeCreate | 组件刚刚被创建,但Data、method等属性还没被计算出来 |
created | 组件创建已经完成,但DOM还没被生成出来 |
beforeMount | 模板编译之前 |
mounted | 模板编译之后,组件准备 |
beforeUpdate | 组件更新之前(数据等变动的时候) |
updated | 组件更新之后(数据等变动的时候) |
activated | for keep-alive,组件被激活时调用 |
deactivated | for keep-alive,组件被移除时调用 |
beforeDestory | 组件销毁之前 |
destoryed | 组件销毁之后 |
2.0生命生命周期变化感觉变得更加语义化一点(有规律可寻,更好记了),而且增加了beforeUpdate、updated、activated、deactivated,删除了attached、detached。
二:过滤器
2.0将1.0所有自带的过滤器都删除了,也就是说,在2.0中,要使用过滤器,则需要我们自己编写,以下是一个自定义过滤器示例,
Vue.filter('toDou',function(n,a,b){
return n<10?n+a+b:''+n;
});
三:循环
关于整数循环,1.0的整数循环是从0开始的,2.0的整数循环是从1开始的,下面对比:
//HTML代码<ul id='box'>
<li v-for='val in 5' v-text='val'></li></ul>
四、片段代码
编写template的时候,2.0必须要用一个根元素(如div)将代码片段包裹起来,否则报错。
之前: 在1.0使用时完全没问题
<template>
<h4>我是组件</h4><strong>我是加粗标签</strong>
</template>
现在: 必须有根元素,包裹住所有的代码
<template id="aaa">
<div>
<h4>我是组件</h4>
<strong>我是加粗标签</strong>
</div>
</template>
以上是vue1.0与2.0有哪些区别的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注亿速云行业资讯频道!
亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。