v3-migration.vuejs.orgVue 3 Migration Guide

Main Navigation Vue 3 Docs English 中文简体 日本語 Українська Português English 中文简体 日本語 Українська Português Appearance Menu Return to top Sidebar Navigation Guide Overview New Recommendations Migration Build Breaking Changes Global API Global API Application Instance Global API Treeshaking Template Directives v-model key Usage Change v-if vs. v-for Precedence v-bind Merge Behavior v-on.native modifier removed Components Functional Components Async Components emits Option Render Function Render Function API Slots Unification $listeners merged into $attrs $attrs includes class & style Custom Elements Custom Elements Interop Changes Removed APIs v-on keyCode Modifiers Events API Filters inline-template $children propsData option Other Minor Changes Attribute Coercion Behavior Custom Directives Data Option Mount API changes Props Default Function this Access Transition Class Change Transition as Root Transition Group Root Element VNode lifecycle events Watch on Arrays On this page Table of Contents for current page ​ Vue 2 support will end on December 31st, 2023. Learn more about Extended LTS if upgrading to Vue 3 isn’t feasible before the EOL date. This guide is primarily for users with prior Vue 2 experience who want to learn about the changes between Vue 2 and Vue 3. This is not something you have to read from top to bottom before trying out Vue 3. The recommended way to learn Vue 3 is by reading the new documentation . Get the free Migration Guide Cheat Sheet at VueMastery.com Notable New Features ​ Some of the new features to keep an eye on in Vue 3 include: Composition API * SFC Composition API Syntax Sugar ( script setup ) * Teleport Fragments Emits Component Option ** createRenderer API from @vue/runtime-core to create custom renderers SFC State-driven CSS Variables ( v-bind in style ) * SFC style scoped can now include global rules or rules that target only slotted content Suspense experimental * Now also supported in Vue 2.7 ** Supported in Vue 2.7, but only for type inference Breaking Changes ​ Breaking changes between Vue 2 and Vue 3 are listed here . New Framework-level Recommendations ​ New framework-level recommendations are listed here . Migration Build ​ If you have an existing Vue 2 project or library that you intend to upgrade to Vue 3, we provide a build of Vue 3 that offers Vue 2 compatible APIs. Check out the Migration Build page for more details. Next page New...