美文网首页
vue2.0与vue1.0中的区别1

vue2.0与vue1.0中的区别1

作者: beat_3e68 | 来源:发表于2019-04-23 12:10 被阅读0次

vue2.0与vue1.0中的区别1:每个组件模板中不在支持片段代码

在vue1.0 中的模板template中可以分开书写片段代码例:

      在vue2.0中需要使用div将片段代码包裹起来例:


vue2.0与vue1.0中的区别2:组件的定义发生了改变和升级

     1.对于vue1.0中的vue.extend定义组件的方式在2.0里面依然存在但是也有所改动,这种写法虽然还有但是我不推荐大家继续使用

     2.在1.0中我们一般定义组件的方式为

这种方式任然存在并且可以使用

在2.0中新推出一种更加简洁的组件定义方式(全局)

在2.0中新推出一种更加简洁的组件定义方式(局部)

组件间的通信使用:进行子组件获取父级数据vue1.0

例如  

在vue2.0中子组件获取父组件的数据虽然是用同样方法但是,父组件需要给子组件传递的是一个json而不是单一的数据,否则会出现报错。新写法

建议在vue2.0中使用单一事件管理组件通信(子组件与子组件之间的通信)

首先我们新建3个组件

新建一个空的vue实例

在对应的子组件中使用$emit发送数据

当我们在点击发送的时候,将子组件中的数据a发送出去

然后我们需要在对应的组件中接收$on

当我们在点击发送时,子组件b接收来自于组件a的数据并弹出

生命周期发生了变化

在vue1.0中的生命周期及(钩子函数)为

init

created(实例已经创建)

beforeCompile(编译之前)

compiled(编译之后)

reday(插入到文档之中)

beforeDestory(销毁之前)

Destroyed(销毁之后)

在vue2.0中已经中了较大幅度的修改

beforeCreate(){  组件实例刚被创建 }

Created(){  组件实例已经创建属性已经绑定 }

beforeMount(){  模板编译之前 }

Mounted(){  模板编译之后}

beforeUpdate(){  组件更新之前 }

Update(){  组件更新之后 }

beforeDestory(销毁之前)

Destroyed(销毁之后)

vue2.0里面的循环

在vue2.0里面,默认可以添加重复的数据,在2.0里也去掉了一些隐式的变量:如$index

之前 的track-by也去掉了,现在可以使用:key =‘index'实现

过滤器:

在2.0中系统中自带过滤器全部去掉了,json过滤器直接已经可以实现,其他的一些过滤器需要我们自己使用自定义过滤器自己定义。

相关文章

  • vue2.0与vue1.0中的区别1

    vue2.0与vue1.0中的区别1:每个组件模板中不在支持片段代码 在vue1.0 中的模板template中可...

  • vue1.0与vue2.0路由的区别

    个人总结——vue1.0与vue2.0路由的区别 vue1.0 html部分———— 主页 跳转链接 ...

  • VUE的学习笔记

    vue和react的区别。 vue1.0是双向绑定的,vue2.0是单向绑定的,v-model是一个语法糖。rea...

  • Vue2.0中的路由配置

    Vue2.0较Vue1.0,路由有了较大改变。看一下Vue2.0中的路由如何配置: 步骤一: 在main.js文件...

  • Vue2.0中的transition组件

    组件的过度 Vue1.0中transition做为标签的行内属性被vue支持。但在Vue2.0中。Vue放弃了旧属...

  • vue生命周期和钩子函数

    vue1.0与2.x的区别: 这个运行中的html可以充分解释如上问题:

  • vue2.0的动画和1.0的动画

    相对于vue1.0来说,vue2.0的动画变化还是挺大的,在1.0中,直接在元素中加 transition ,后面...

  • vue的生命周期

    Vue官网Vue GitHubVue1下载地址Vue1.0 在线文档Vue2下载地址Vue2.0 在线文档 1. ...

  • Vue2.0中Filter的使用问题

    vue2.0里,不再有自带的过滤器,需要自己定义过滤器 在 Vue1.0 中内置了几种实用的过滤器函数如 uppe...

  • vue学习大纲3-过滤器、指令、动画

    自定义过滤器: 在vue1.0中有过滤器,比如: 在vue2.0中所有的内置过滤器都被销毁了,2.0推荐我们自己写...

网友评论

      本文标题:vue2.0与vue1.0中的区别1

      本文链接:https://www.haomeiwen.com/subject/dgtdeqtx.html