高层级的变化

  • 模板解析器不再依赖于DOM(除非你使用真正的DOM作为模板),因此只要你使用字符串模板,你将不再受到任何1.0版本中的解析限制。但是,如果你依赖在存在的内容中挂载一个元素作为模板(使用el元素),你将依然受到这些限制。
  • 编译器(将字符串模板转换为渲染方法的部分)和运行时间现在能够被分开。这里有两种不同的构建:
    • 独立构建:包括编译并且运行。这种方式和vue 1.0几乎完全一样。
    • 运行时编译:由于它不包括编译器,在编译步骤时要么预编译模板,要么手动编写渲染功能。npm包默认导出这个版本,那么你需要有一个编译的过程(使用Browserify或Webpack ),从中vueify或vue-loader将可以进行模板预编译。

全局配置

  • Vue.config.silent
  • Vue.config.optionMergeStrategies
  • Vue.config.devtools
  • Vue.config.errorHandler(新API,全局的挂钩用于在组件渲染和监控的时候处理未捕获的错误)
  • Vue.config.keyCodes(新API,为v-on配置自定义的key的别名)
  • Vue.config.debug(已丢弃)
  • Vue.config.async(已丢弃)
  • Vue.config.delimiters(已丢弃)
  • Vue.config.unsafeDelimiters(已丢弃,使用v-html)

全局API

  • Vue.extend
  • Vue.nextTick
  • Vue.set
  • Vue.delete
  • Vue.directive
  • Vue.component
  • Vue.use
  • Vue.mixin
  • Vue.compile(新API,只能用于独立版本构建)
  • Vue.transition
  • stagger(已丢弃,在el上设置
  • Vue.filter
  • Vue.elementDirective(已丢弃,使用组件)
  • Vue.partial (已丢弃,使用功能组件)

选项

data

  • data
  • props

。prop

。default

。coerce(已丢弃,如果你需要转换prop,请使用compute属性)

。prop binding modes(已丢弃,v-model在组件上可以工作

  • propsData(新API)只能用于实例
  • computed
  • methods
  • watch

DOM

  • el
  • template
  • render(新API)
  • replace(已丢弃,组件现在必须有一个根元素)

生命周期钩子

  • init(已丢弃,请使用beforeCreate)
  • created
  • beforeDestroy
  • destroyed
  • beforeMount(新API)
  • mounted(新API)
  • beforeUpdate(新API)
  • updated(新API)
  • activated(新API,用于keep-alive)
  • deactivated(新API用于keep-alive)
  • ready(已丢弃,使用mounted)
  • activate(已丢弃,迁移到vue-router)
  • beforeCompile(已丢弃,使用created)
  • compiled(已丢弃,使用mounted)
  • attached(已丢弃)
  • detached(已丢弃,同上)

Assets

  • directives
  • components
  • transitions
  • filters
  • partials(已丢弃)
  • elementDirectives(已丢弃)

杂项

  • parent
  • mixins
  • name
  • extends
  • delimiters(新API,替代原版的全局配置选项,只在独立构建中可用)
  • functional(新API)
  • events(已丢弃)

实例方法

data

  • vm.$watch
  • vm.$get(已丢弃,直接检索值)
  • vm.$set(已丢弃,使用Vue.set)
  • vm.$delete(已丢弃,使用Vue.delete)
  • vm.$eval(已丢弃,没有真正的使用)
  • vm.$interpolate(已丢弃,同上)
  • vm.$log(已丢弃,使用devtools)

events

  • vm.$on
  • vm.$once
  • vm.$off
  • vm.$emit
  • vm.$dispatch(已丢弃,使用全局的事件或使用vuex,见下面)
  • vm.$broadcast(已丢弃,同上)

DOM

  • vm.$nextTick
  • vm.$appendTo(已丢弃,在 vm.$el上使用本地API)
  • vm.$before(已丢弃)
  • vm.$after(已丢弃)
  • vm.$remove(已丢弃)

生命周期

  • vm.$mount
  • vm.$destroy

指令

  • v-text
  • v-html(注意{{{ }}} 被丢弃)
  • v-if
  • v-show
  • v-else
  • v-for

。key (替代 track-by)

。object v-for

。range v-for

。参数顺序更新:数组中使用(value, index) in arr,对象中使用(value, key, index) in obj

。$index和$key被丢弃

  • v-on

。modifiers

。on child component

。自定义键码,目前版本Vue.config.keyCodes代替原来的Vue.directive('on').keyCodes

  • v-bind

。作为prop

。xlink

。绑定对象

  • v-bind:style

    • prefix sniffing
  • v-bind:class
  • v-model
    • lazy (as modifier)
    • number (as modifier)
    • ignoring composition events
    • debounce(已丢弃,使用v-on:input)
  • v-cloak
  • v-pre
  • v-once(新API)
  • v-ref(已丢弃,现在只是一个特殊的属性ref)
  • v-el(和ref合并)

特殊组件

  • <component>

    • :is
    • async组件
    • inline-template
  • <transition>
  • <transition-group>
  • <keep-alive>
  • <slot>
  • partial(已丢弃)

特殊属性

  • key
  • ref
  • slot

服务器端渲染

  • renderToString
  • renderToStream
  • client-side hydration
作者:白小爱
来源:51CTO

[译]Vue 2.0的变化(一)之基本API变化相关推荐

  1. Element 官方宣布了:Element UI for Vue 3.0 来了!

    Element Plus for Vue 3.0 来了,这次真的来了! Element 开发团队宣布正式发布 Element Plus 的首个 beta 版本,Element Plus 是 Eleme ...

  2. vue 1.0和vue 2.0的变化和区别

    一.在每个组件模板,不在支持片段代码 vue 1.0是 <template><h3>我是组件</h3><strong>我是加粗标签</strong ...

  3. 全面改革:解读 Vue 3.0 的变化

    9月30日,尤雨溪在medium个人博客上发布了vue3.0的开发思路,国内有翻译的版本,见文章最后的参考链接.3.0带了了很大的变化,他讲了一些改进的思路以及整个开发流程的规划. vue3.0的改进 ...

  4. 关于Vue 3.0 的改进 Proxy 代理实现数据驱动视图

    Vue 3.0 中使用了 Proxy 对象代理进行拦截实现了数据绑定视图的驱动操作.弥补了vue2.0中的局限,比如属性删除增加监听.对数组基于下标的修改.长度变化等等. 参考一下网上流传的机制图 P ...

  5. jsx怎么往js里传参数_实践Vue 3.0做JSX(TSX)风格的组件开发

    作者:莫夭 转发链接:https://zhuanlan.zhihu.com/p/102668383 前言 我日常工作都是使用React来做开发,但是我对React一直不是很满意,特别是在推出React ...

  6. Vue 2.0 v-for 响应式key, index及item.id参数对v-bind:key值造成差异研究

    Vue 2.0 v-for 响应式key, index及item.id参数对v-bind:key值造成差异研究 在github上阅览README.md以获得最佳阅读体验,点这里 v-for响应式key ...

  7. 看完后完全了解 Vue 2.0 和 Vue 3.0 的区别

    1.数据的双向绑定 Vue2.0使用Object.defineProperty 原理:通过使用 Object.defineProperty 来劫持对象属性的 geter 和 seter 操作,当数据发 ...

  8. vue 3.0 正式版_Vuejs 3 Release:One Piece. Vuejs 3.0 正式版发布!代号:海贼王

    Vuejs 3.0 在北京时间2020年9月19日凌晨,终于发布了 3.0 版本,代号:One Piece.此次vue3.0 为用户提供了全新的 composition-api 以及更小的包大小,和更 ...

  9. vue 监听map数组变化_解决vue无法侦听数组及对象属性的变化问题

    一.数组 1.可以监听到的情况 如push.splice.=赋值(array=[1,2,3]) 2.无法监听到的情况 使用下标修改某个元素(这种比较常见) array[index] = 1 objec ...

  10. vue tree组件_使用Vue 3.0做JSX(TSX)风格的组件开发

    前言 我日常工作都是使用React来做开发,但是我对React一直不是很满意,特别是在推出React Hooks以后. 不可否认React Hooks极大地方便了开发者,但是它又有非常多反直觉的地方, ...

最新文章

  1. Web用户控件的一个毛病
  2. 记一次前端问题解决历程(Cannot read Property ‘call‘ of undefined)
  3. uml 工具_UML建模工具更新202008(1)Rhapsody名字不再有Rational
  4. 使用fcntl编写set_fl()函数和clr_fl()函数
  5. 丹佛斯冷媒尺汉化下载_制冷系统十大仿真软件!制冷百家网下载
  6. QT接收Linux内核,嵌入式linux上QT标准键盘输入的实现
  7. 语言程序设计赵山林电子版_【特别策划】崇州“老市长”赵抃系列之一:做官要像江水保持清白...
  8. [转载] Numpy学习之矩阵、函数、二元运算及数组读写
  9. java 到异常_java编程中遇到的异常以及异常的一些处理
  10. win7 exfat补丁_大神面对 win7系统安装补丁提示安装程序出错的操作方案 -win7系统使用教程...
  11. 最终幻想14钓鱼辅助脚本(非外挂)
  12. docker配置mysql文件位置_Docker安装MySQL并挂载数据及配置文件
  13. plcst语言编程教程_st语言编程实例讲解
  14. 分辨率、像素、像素尺寸、GSD、图片文件大小
  15. RS-485总线,这篇很详细
  16. 谈如何用SNS做淘宝客
  17. vs2019社区版下载教程(详细)
  18. 04、【电脑维修】Win 10重新安装微软商店以及便筏打不开问题
  19. 2021-10-01
  20. Datawhale组队学习周报(第048周)

热门文章

  1. 序列最小最优化算法(SMO)
  2. github第一次使用--创建hello-world
  3. 象棋将帅不能碰面 java_为何象棋有“将帅不能碰面”的规则?原来这有一个不为人知的典故...
  4. Android TextView 文字居中
  5. Gephi绘制网络图初步探索
  6. 基于python和mysql的查询操作
  7. mysql编码utf8改为g_修改MySQL的编码为UTF8
  8. Sql 查询库、表、列名的语句
  9. 在sublime text 3中让.vue文件的内容变成彩色
  10. react实例9-拖拽2