vue.js2.0有什么改动？下面本篇文章给大家介绍一些Vue的变化与更新。有一定的参考价值，有需要的朋友可以参考一下，希望对大家有所帮助。
1、v2 每个组件只允许有一个根元素，v1 允许一个组件有多个根元素。【相关推荐：vue.js视频教程】
2、vue2.0移除了自带过滤器，但是保留了自定义过滤器的功能。
3、生命周期函数不同
vue1.0
| 周期 | 解释 |
|---|---|
| init | 组件刚刚被创建，但Data、method等属性还没被计算出来 |
| created | 组件创建已经完成，但DOM还没被生成出来 |
| beforeCompile | 模板编译之前 |
| compiled | 模板编译之后 |
| ready | 组件准备（平时用得较多） |
| attached | 在 vm.$el 插入到DOM时调用 |
| detached | 在 vm.$el 从 DOM 中删除时调用 |
| beforeDestory | 组件销毁之前 |
| destoryed | 组件销毁之后 |
vue2.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。
4、vue 指令
v-bind
v-bind 指令对于真假值的判断，v1 遵循 js 的一般规则，v2 中则只有 null、undefined、false 被看作是假，0 和 '' 则被视为真值。
此规则只限于 v-bind 指令，v-if 和 v-show 仍遵循 js 的规则
v-on
v1 中 v-on 指令可以监听原生事件， v2 中只监听自定义事件，如果需要监听原生事件，需要加上 .native 修饰符。
v-model
lazy、number 参数
v2 中的 .lazy、.number 修饰符，在 v1 中以标签属性的形式出现
<input v-model="name" lazy> <input v-model="age" type="number" number>
v-model 的初值
v2 中 v-model 的初值就是所绑定的 data 的值，但是在 v1 中，会用当前标签元素的 value 作为初值。
v-bind:style
v1 中的 v-bind:style 可以添加 !important，v2 中必须写成字符串形式。如下
// v1
<p v-bind:style="{ color: myColor + ' !important' }">hello</p>
// v2
<p v-bind:style="'color: ' + myColor + ' !important'">hello</p>v-el 和 v-ref
v1 中可以分别使用 v-el 为 DOM 元素、v-ref 为 component 指定一个 name，方便调用该元素或组件实例，v2 中弃用了这两个指令，统一使用 ref='name' 的方式。
v-show 与 v-else 一起使用
v1 中允许 v-show 与 v-else 一起使用，如下
// v1 <p v-if="foo">Foo</p> <p v-else v-show="bar">Not foo, but bar</p> // v2 <p v-if="foo">Foo</p> <p v-if="!foo && bar">Not foo, but bar</p>
5、路由
映射路由： 1.0是通过router的map方法映射路由，并且map接收的是一个对象，2.0中map()被替换了，通过实例化VueRouter并定义一个数组来映射路由；
初始化路由： 1.0通过router.start()来初始化路由，2.0中router.start()被替换了，直接通过挂载到vue根实例进行初始化
想要了解更多相关知识，可访问 前端学习网站！！
以上就是vue.js2.0有什么改动？的详细内容，更多请关注0133技术站其它相关文章！
