The setup() Function

Overview

One of the biggest changes in Vue 3 is the introduction of the Composition API as an alternative way of creating components. The Composition API in Vue is a set of functions and syntax enhancements that allow developers to organize and reuse component logic in a more flexible and composable manner and therefore is a major addition to Vue.

The setup() function

Key to the new syntax that is composition API is the setup() method. We can declare this on a component the same way we would a lifecycle methodA lifecycle method in Vue is defined as a function within a Vue component, such as created() { }..

We can return an object from the method, and its properties will be available within the template (and to the rest of the components).