Vue1.x 到Vue2.0的一个变化
小弟初来乍到,写的不好的地方还望指正。谢谢各位!
废话不多说 进入正题:
Vue1.x到2.0的一个变化
        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:''  ->   Vue.extend()
             };
3. 生命周期
之前:
        init
        created
        beforeCompile
        compiled
        ready        √    ->     mounted
        beforeDestroy
现在:
        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"    
5. 自定义键盘指令
       之前:Vue.directive('on').keyCodes.f1=17;    
       现在:  Vue.config.keyCodes.ctrl=17
6.过滤器
    之前:
        系统就自带很多过滤
        {{msg | currency}}
        {{msg | json}}
        ....
        limitBy
        filterBy
        .....
    一些简单功能,自己通过js实现
    到了2.0, 内置过滤器,全部删除了
    lodash    工具库    _.debounce(fn,200)
    自定义过滤器——还有
        但是,自定义过滤器传参
        之前:    {{msg | toDou '12' '5'}}
        现在:     {{msg | toDou('12','5')}}
7.组件通信
   vm.$emit()
    vm.$on();
    父组件和子组件:
    子组件想要拿到父组件数据:
        通过  props
    之前,子组件可以更改父组件信息,可以是同步  sync
    现在,不允许直接给父级的数据,做赋值操作
    问题,就想更改:
        a). 父组件每次传一个对象给子组件, 对象之间引用    √
        b). 只是不报错, mounted中转
      
       
Vue1.x 到Vue2.0的一个变化的更多相关文章
- 基于vue2.0的一个豆瓣电影App
		1.搭建项目框架 使用vue-cli 没安装的需要先安装 npm intall -g vue-cli 使用vue-cli生成项目框架 vue init webpack-simple vue-movie ... 
- vue2.0有哪些变化
		vue2.0之后有哪些变化: 1.每个组件模板template,不再支持片段代码 之前: <template> <h3>vue-router+vue-loader</h3 ... 
- 基于vue2.0的一个系统
		前言 这是一个用vue做的单页面管理系统,这里只是介绍架子搭建思路 前端架构 沿用Vue全家桶系列开发,主要技术栈:vue2.x+vue-router+vuex+element-ui1.x+axios ... 
- 基于vue2.0的一个分页组件
		分页组件在项目中经常要用到之前一直都是在网上找些jq的控件来用(逃..),最近几个项目用上vue了项目又刚好需要一个分页的功能.于是百度发现几篇文章介绍的实在方式有点复杂, 没耐心看自己动手造轮子写了 ... 
- vue2.0实现一个模态弹框,内容自定义(使用slot)
		定义模态框:合理使用插槽 model.vue <!-- 模态弹窗 --> <template> <div class="self-modal" v-s ... 
- vue1.0和vue2.0的区别(一)
		今天我们来说一说vue1.0和vue2.0的主要变化有哪些 一.在每个组件模板,不在支持片段代码 VUE1.0是: <template> <h3>我是组件</h3> ... 
- vue2.0动画
		相对于vue1.0来说,vue2.0的动画变化还是挺大的, 在1.0中,直接在元素中加 transition ,后面跟上名字. 而在vue2.0中,需要把设置动画的元素.路由放在<transit ... 
- vue2.0实现购物车功能
		购物车功能是一件比较繁琐的事情,逻辑功能太多,今天就用vue2.0实现一个简单的购物车功能,数据都本地自己写的假数据 功能列表: 1.全选和单选结算 2.减少和增加数量 3.商品的删除 界面搭建以及布 ... 
- 用Vue2.0实现简单的分页及跳转
		用Vue2.0实现简单的分页及跳转 2018年07月26日 20:29:51 Freya_yyy 阅读数 3369 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog ... 
随机推荐
- Hadoop默认端口表及用途
			端口 用途 9000 fs.defaultFS,如:hdfs://172.25.40.171:9000 9001 dfs.namenode.rpc-address,DataNode会连接这个端口 ... 
- cocos2dx遇到的一些坑
			针对2.x 1.CCSprite无法直接用文件名更换图片,可以添加如下函数 bool CCSprite::setWithFile(const char *pszFilename) { CCAssert ... 
- Flume Channel Selectors + kafka
			http://flume.apache.org/FlumeUserGuide.html#custom-channel-selector 官方文档上channel selectors 有两种类型: Re ... 
- Android——Activity生命周期(转)
			Activity生命周期 子曰:溫故而知新,可以為師矣.<論語> 学习技术也一样,对于技术文档或者经典的技术书籍来说,指望看一遍就完全掌握,那基本不大可能,所以我们需要经常回过头再仔细 ... 
- signal基础
			signal man 7 signal 1.kill -l 显示所有信号 kill -signal PID killall -signal name 2.产生信号 ctrl+c => SIGIN ... 
- MySQL 5.6的72个新特性(译)
			一,安全提高 1.提供保存加密认证信息的方法,使用.mylogin.cnf文件.使用 mysql_config_editor可以创建此文件.这个文件可以进行连接数据库的访问授权. mysql_conf ... 
- word调整技巧
			a4纸如何留白: 
- adb shell error: more than one device and emulator
			adb shell error: more than one device and emulator 本文转载出处: http://blog.sina.com.cn/s/blog_7ffb8dd501 ... 
- MyBatis学习4---使用MyBatis_Generator生成Dto、Dao、Mapping
			由于MyBatis属于一种半自动的ORM框架,所以主要的工作将是书写Mapping映射文件,但是由于手写映射文件很容易出错,所以查资料发现有现成的工具可以自动生成底层模型类.Dao接口类甚至Mappi ... 
- hdu 2612:Find a way(经典BFS广搜题)
			Find a way Time Limit: 3000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total ... 
