1. 在每个组件模板,不在支持片段代码
组件中模板:
  之前:
    <template>
      <h3>我是组件</h3><strong>我是加粗标签</strong>
    </template>
  现在: 必须有根元素,包裹住所有的代码
    <template id="aaa">
      <div>
        <h3>我是组件</h3>
        <strong>我是加粗标签</strong>
      </div>
    </template>

2. 关于组件定义
  Vue.extend 这种方式,在2.0里面有,但是有一些改动,这种写法,即使能用,咱也不用――废弃

  Vue.component(组件名称,{      在2.0继续能用
    data(){}
    methods:{}
    template:
  });

2.0推出一个组件,简洁定义方式:
  var Home={
    template:     
  };

3. 生命周期
之前:
  init
  created
  beforeCompile
  compiled
  ready √ -> mounted
  beforeDestroy
  destroyed
现在:
  beforeCreate      组件实例刚刚被创建,属性都没有
  created          实例已经创建完成,属性已经绑定
  beforeMount        模板编译之前
  mounted         模板编译之后,代替之前ready *
  beforeUpdate       组件更新之前
  updated           组件更新完毕 *
  beforeDestroy      组件销毁前
  destroyed        组件销毁后
4. 循环
  2.0里面默认就可以添加重复数据

    去掉了隐式一些变量
      $index $key

    之前:
      v-for="(index,val) in array"
    现在:
      v-for="(val,index) in array"
      v-for="(val,key,index) in json"

5. track-by="id"
  变成
  <li v-for="(val,index) in arr" :key="index">
6. 自定义键盘指令
  之前:Vue.directive('on').keyCodes.ctrl=17;

  现在: Vue.config.keyCodes.ctrl=17
7. 过滤器
之前:
  系统就自带很多过滤
  {{msg | currency}}
  {{msg | json}}
  ....
  limitBy
  filterBy
  .....
一些简单功能,自己通过js实现

到了2.0, 内置过滤器,全部删除了
  之前需要json过滤器转的,现在不需要了,默认已经转了

lodash 工具库 _.debounce(fn,200)

自定义过滤器——还有
但是,自定义过滤器传参

之前: {{msg | toDou '12' '5'}}
现在: {{msg | toDou('12','5')}}

------------------------------------------------------
组件通信:
vm.$emit()
vm.$on();

父组件和子组件:

子组件想要拿到父组件数据:
通过 props

之前,子组件可以更改父组件信息,可以是同步 sync
现在,不允许直接给父级的数据,做赋值操作

问题,就想更改:
a). 父组件每次传一个对象给子组件, 对象之间引用 √
b). 只是不报错, mounted中转
------------------------------------------------------
可以单一事件管理组件通信: vuex
var Event=new Vue();

Event.$emit(事件名称, 数据)

Event.$on(事件名称,function(data){
//data
}.bind(this));
------------------------------------------------------
debounce 废弃
-> lodash
_.debounce(fn,时间)
------------------------------------------------------

vue2.0的变化的更多相关文章

  1. Vue2.0的变化 ,组件模板,生命周期,循环,自定义键盘指令,过滤器

    组件模板: 之前: <template> <h3>我是组件</h3><strong>我是加粗标签</strong> </templat ...

  2. vue2.0路由变化1

    路由的步骤 1.定义组件 var Home={ template:'<h3>我是主页</h3>' }; var News={ template:'<h3>我是新闻& ...

  3. 【重点突破】—— Vue1.0到Vue2.0的变化

    前言: 本文参考作者:_So_ 和 我是某慧 的博文,重点梳理Vue1.0升级到Vue2.0后在开发中要注意的不同,以做学习.        组件模板不再支持片段代码,必须有一个顶级元素包裹,例如: ...

  4. vue2.0有哪些变化

    vue2.0之后有哪些变化: 1.每个组件模板template,不再支持片段代码 之前: <template> <h3>vue-router+vue-loader</h3 ...

  5. VUE2.0不可忽视的很多变化

    今天使用webpack-sample初始一个vue-cli项目,在app.vue文件中添加了个钩子函数ready,可是ready内的事件一直不执行,检查了webpack文件和package.json也 ...

  6. vue2.0变化

    之前有很多的vue知识总结都是围绕1.0版本实现的,下面主要总结一下2.0相对于1.0的一些变化. 组件定义 在vue1.0中,我们有使用vue.extend()来创建组件构造器继而创建组件实例,如下 ...

  7. Vue2.0中v-for迭代语法变化(key、index)【转】

    转自:http://blog.csdn.net/sinat_35512245/article/details/53966788 Vue2.0的代码中发现 $key这个值并不能渲染成功,问题如下:但是v ...

  8. Vue2.0以后,有哪些变化

    最近移动端项目版本升级,Vue由之前的1.0升级到2.3,那么,Vue2.0之后,有哪些细节的变化呢,现在总结如下: 1.在每个组件模板,不再支持片段代码 组件中模板: 之前: <templat ...

  9. vue2.0构建淘票票webapp

    项目描述 之前一直用vue1.x写项目,最近为了过渡到vue2.0,特易用vue2.0栈仿写了淘票票页面,而且加入了express作为后台服务. 前端技术栈:vue2.0 + vue-router + ...

随机推荐

  1. springboot2 -广播式WebSocket

    1.WebSocket,STOMP,SockJS含义 WebSocket:WebSocket是HTML5开始提供的一种在单个 TCP 连接上进行全双工通讯的协议. SockJS:SockJS 是 We ...

  2. STL中的vector实现邻接表

    /* STL中的vector实现邻接表 2014-4-2 08:28:45 */ #include <iostream> #include <vector> #include  ...

  3. HDU - 4006 The kth great number multiset应用(找第k大值)

    The kth great number Xiao Ming and Xiao Bao are playing a simple Numbers game. In a round Xiao Ming ...

  4. SmartSql使用教程(1)——初探,建立一个简单的CURD接口服务

    一.引言 最近SmartSql被正式引入到了NCC,借着这个契机写一个使用教程系列 二.SmartSql简介[摘自官方文档] 1. SmartSql是什么? SmartSql = MyBatis + ...

  5. 子div块中设置margin-top时影响父div块位置的解决办法及其原因

    解决办法①: 若子DIV块中使用margin-top,则在父DIV块中添加:overflow:hidden; 解决办法②: 在子DIV块中用padding-top代替margin-top. 有个叫 b ...

  6. Linux | C代码的编写、运行和调试

    1.  建立.c文件 在终端下输入:vi mytest.c [使用编辑器 vim] 键入键盘i键,使vi编辑器进入编辑模式 接下来在vi编译器中编写代码,如: #include <stdio.h ...

  7. js+canvas(H5)实现小球移动小demo

    *canvas提供画布,大小自定义,js得到画布,从画布对象通过getContext('2d')来得到画笔,然后就可以开始画了 代码: <!DOCTYPE html> <html l ...

  8. 爬虫的UA池和代理池

    爬虫的UA池和代理池   一.下载中间件 先祭出框架图: 下载中间件(Downloader Middlewares) 位于scrapy引擎和下载器之间的一层组件. - 作用: (1)引擎将请求传递给下 ...

  9. 洛谷1537(bitset+01背包)

    总数是偶数并且其一半可得即可. bitset的移位可替代原本的数组转移. #pragma comment(linker, "/STACK:1024000000,1024000000" ...

  10. [HDU1595] find the longest of the shortest

    题目链接: 点我 题意: 给定一个\(n\)个点,\(m\)条边的带权无向图,起点为\(1\),终点为\(n\),现在可以删去其中的一条边,求一种删边方案使得剩下图的最短路值最大,输出这个最短路的长度 ...