Vue2.js迁移到Vue3.js的API变化,-
表示移除
Vue2.js | Vue3.js |
new Vue() | createApp() |
Vue.extend | defineComponent or extends |
Vue.prototype | app.config.globalProperties |
Vue.set | - |
Vue.delete | - |
Vue.observable | reactive |
config.keyCodes | - |
vm.$set | - |
vm.$delete | - |
vm.$on | - |
vm.$off | - |
vm.$once | - |
vm.$children | - |
vm.$listeners | - |
hook:x | - |
vm.$scopedSlots | - |
vm.$slots | now exposes functions |
$attrs | now includes class and style |
data | must be a function in all cases |
data | from mixin or extension is now shallow merged |
beforeDestroy | beforeUnmount |
destroyed | unmounted |
v-on | no longer supports keyCode modifiers |
- | watching an array no longer triggers on mutation unless deep |
- | Custom directive hook names changed |
- | No longer removes attribute if binding value is boolean false |
- | No longer special case enumerated attributes |
<transition-group> |
no longer renders a root element by default |
- | Async component API changed (now requires defineAsyncComponent) |
- | Functional component API changed (now must be plain functions) |
- | Component v-model reworked |
- | Render function API changed |
- | Filters removed (this option affects only runtime filter APIs) |
- | is usage is now restricted to <component> only |
v-bind.sync | replaced by v-model with arguments |
v-bind.prop | modifier removed |
v-bind=“object” | is now order sensitive |
v-on.native | modifier removed |
- | ref in v-for (compiler support) |
<template> |
with no special directives now renders as native element |
- | filters (compiler support) |
参考
https://v3-migration.vuejs.org/migration-build.html#fully-compatible