Question 1

How do you handle events in Vue (v-on and event modifiers)?

Accepted Answer

**Target Audience:** Beginners wiring up buttons, forms and keyboard shortcuts in Vue. Basic DOM events (click, submit, keyup) assumed; no Vue experience needed. **Difficulty:** Easy > **How to read this doc:** Plain language first, then 📌 Interview term: callouts. Every "what got logged" table, compiled handler and ordering claim below was produced by dispatching real DOM events at components mounted on Vue 3.5.44 in jsdom. ## 1. Why This E

Question 2

What are Vue directives? Give common examples.

Accepted Answer

**Target Audience:** Beginners who can read a basic Vue template and want to understand every v- attribute they see. Basic HTML and JavaScript assumed. **Difficulty:** Easy > **How to read this doc:** Plain language first, then 📌 Interview term: callouts. The rendered output, the compiled render function and the warnings below come from compiling and mounting the example on Vue 3.5.44, not from memory. ## 1. Why This Even Matters — A Story First Imagine a theatre sc

Question 3

What are dynamic arguments and v-bind shorthand?

Accepted Answer

**Target Audience:** Vue beginners who know what `v-bind` and `v-on` do and want the full picture of their syntax.
**Difficulty:** Easy

> **How to read this doc:** Plain language first, then `📌 Interview term:` callouts. The compiled code, compiler errors, runtime errors and DOM output below came from running Vue 3.5.44 (`@vue/compiler-dom` for compiler output, jsdom for the runtime).

## 1. Why This Even Matters — A Story First

Think of a label maker at a warehouse. Normally the operator typ

Question 4

What changed from Vue 2 to Vue 3, and what does Vue 2 end of life mean?

Accepted Answer

**Target Audience:** Developers who meet Vue 2 code at work, or see Vue 2 tutorials online, and need to explain what is different in Vue 3. Basic Vue knowledge helps but every term is defined. **Difficulty:** Easy > **How to read this doc:** Plain language first, then 📌 Interview term: callouts. The comparisons in sections 4 and 5 were not taken from the migration guide: the same code was run on **vue 2.7.16** and **vue 3.5.44** side by side in Node with jsdom, and the outputs are

Question 5

How does v-model work on form inputs?

Accepted Answer

**Target Audience:** Vue beginners building their first forms. Assumes HTML form elements and a little JavaScript.
**Difficulty:** Easy

> **How to read this doc:** Plain language first, then `📌 Interview term:` callouts. Every state dump, compiler snippet and compiler error below came from running Vue 3.5.44: templates compiled with `@vue/compiler-sfc` / `@vue/compiler-dom`, mounted in jsdom, with a driver typing, clicking and selecting.

## 1. Why This Even Matters — A Story First

Picture a

Question 6

What are v-model modifiers?

Accepted Answer

**Target Audience:** Vue developers who already use `v-model` on inputs and want to control when and how values are stored.
**Difficulty:** Easy

> **How to read this doc:** Plain language first, then `📌 Interview term:` callouts. Every value shown below was read from component state after a driver focused, typed into and blurred real inputs, on Vue 3.5.44 compiled with `@vue/compiler-sfc` and mounted in jsdom.

## 1. Why This Even Matters — A Story First

Think of a receptionist taking phone m

Question 7

What is defineModel() in Vue 3.4+ and how does it replace manual prop + emit?

Accepted Answer

**Target Audience:** Vue 3 developers who know the [component v-model contract](/interview-question/how-does-v-model-work-on-components) and want to know what `defineModel()` really does.
**Difficulty:** Medium

> **How to read this doc:** Plain language first, then `📌 Interview term:` callouts. The compiled output is from `@vue/compiler-sfc` 3.5.44 `compileScript()`, and every value read after a click or keystroke came from mounting the components in jsdom on Vue 3.5.44. Version history comes

Question 8

How does v-model work on components?

Accepted Answer

**Target Audience:** Vue developers who use `v-model` on inputs and now need their own components to support it.
**Difficulty:** Medium

> **How to read this doc:** Plain language first, then `📌 Interview term:` callouts. The compiled output, warnings, compiler errors and the state after typing that are quoted below all came from Vue 3.5.44, compiled with `@vue/compiler-dom` and `@vue/compiler-sfc` and mounted in jsdom.

## 1. Why This Even Matters — A Story First

A hotel guest wants a differe

Question 9

How do you create a custom directive in Vue?

Accepted Answer

**Target Audience:** Vue developers who need low-level DOM behaviour they can reuse across templates. **Difficulty:** Medium > **How to read this doc:** Plain language first, then 📌 Interview term: callouts. Every log line and warning below was printed on Vue 3.5.44 by mounting the SFCs in jsdom with the repo verifier (dev build), and the SSR output by renderToString from @vue/server-renderer. The typed example was checked with TypeScript 5 in strict mode

VUE.JSDECODED.

Easy

How do you handle events in Vue (v-on and event modifiers)?

What are Vue directives? Give common examples.

What are dynamic arguments and v-bind shorthand?

What changed from Vue 2 to Vue 3, and what does Vue 2 end of life mean?

How does v-model work on form inputs?

What are v-model modifiers?

Medium

What is defineModel() in Vue 3.4+ and how does it replace manual prop + emit?

How does v-model work on components?

How do you create a custom directive in Vue?