Computed properties declare a value derived from existing reactive state. Vue tracks their dependencies and caches the result, recomputing only when one of those dependencies changes. This makes them more efficient than calling a method in the template, which would run on every re-render. Use computed() in the Composition API or the computed option in the Options API. They should be pure: derive and return a value without side effects such as mutating other state or making requests.
2 / 5
What does Vue's reactivity system do?
Vue's reactivity system wraps state in proxies so it can detect reads and writes. When a reactive value is read during rendering, Vue records it as a dependency; when that value later changes, Vue knows exactly which components or effects must re-run. This gives you declarative UI without manually calling an update function. In Vue 3 you create reactive state with ref() for single values and reactive() for objects, and the proxy-based tracking handles the rest automatically.
3 / 5
What is a watcher in Vue?
A watcher lets you run imperative side effects when a piece of reactive state changes. Unlike computed properties, which derive a returned value, watchers are meant for actions such as fetching data, writing to local storage, or syncing with a third-party library. In the Composition API you use watch() to observe specific sources or watchEffect() to track dependencies automatically. Watchers receive the new and old values, making them ideal when the response to a change is a task rather than a derived value.
4 / 5
In Vue templates, what is a directive?
A directive is a special template attribute, prefixed with v-, that tells Vue to apply reactive behavior to an element. Built-in examples include v-if for conditional rendering, v-for for lists, v-bind (shorthand :) for dynamic attributes, v-on (shorthand @) for events, and v-model for two-way binding. Directives can take arguments and modifiers, and you can also register custom directives when you need low-level DOM access that components do not cleanly express.
5 / 5
What is the Composition API in Vue 3?
The Composition API is a function-based way to author component logic, centered on setup() and standalone functions such as ref(), reactive(), computed(), and watch(). Instead of splitting code across the Options API's data, methods, and computed sections, you group related state and behavior together. This improves logic reuse through composables and scales better in large components. It coexists with the Options API, and the <script setup> syntax makes it especially concise.