Q: What is v-html and what is the risk of using it?

**Target Audience:** Beginners who have seen v-html in a codebase, or are tempted to use it. Basic HTML assumed; no security background needed. **Difficulty:** Easy > **How to read this doc:** Plain language first, then 📌 Interview term: callouts. The rendered HTML was produced by mounting the example on Vue 3.5.44 in jsdom and with renderToString . Because jsdom does not load images (so an onerror payload can never fire there), the attack its

Question 1

What is Vue.js and what are its core features?

Accepted Answer

**Target Audience:** Complete beginners preparing for a first Vue interview. Assumes you know a little HTML and JavaScript, nothing about Vue or any other framework. **Difficulty:** Easy > **How to read this doc:** Every idea is explained in plain language first, then tagged with 📌 Interview term: so you also learn the exact words an interviewer listens for. The outputs in sections 5 and 6 were produced by actually compiling and running the code on Vue 3.5.44, the current stable r

Question 2

What is v-html and what is the risk of using it?

Accepted Answer

**Target Audience:** Beginners who have seen v-html in a codebase, or are tempted to use it. Basic HTML assumed; no security background needed. **Difficulty:** Easy > **How to read this doc:** Plain language first, then 📌 Interview term: callouts. The rendered HTML was produced by mounting the example on Vue 3.5.44 in jsdom and with renderToString. Because jsdom does not load images (so an onerror payload can never fire there), the attack its

Question 3

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 4

How do defineProps and defineEmits work in <script setup>?

Accepted Answer

**Target Audience:** Vue 3 developers using `<script setup>` who want to understand the two macros they write in almost every component.
**Difficulty:** Easy

> **How to read this doc:** Plain language first, then `📌 Interview term:` callouts. All compiled output and compiler errors come from `@vue/compiler-sfc` 3.5.44 `compileScript()`; runtime logs from a two-component app compiled the same way and mounted in jsdom; type errors from `vue-tsc` 3.3.13.

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

Question 5

How does Vue's reactivity system work?

Accepted Answer

**Target Audience:** Anyone preparing for a Vue interview — assumes basic JavaScript objects and functions, no Vue internals required. **Difficulty:** Medium > **How to read this doc:** Each idea is explained in plain language first, then tagged with 📌 Interview term: so you also learn the words an interviewer listens for. Every output block below was produced by running the code on Vue 3.5.44: plain reactivity with node, components compiled with @vue/compiler-s

Question 6

What is the difference between watch and watchEffect?

Accepted Answer

**Target Audience:** Vue developers who reach for watchers and want to choose between the two on purpose rather than by habit. **Difficulty:** Medium > **How to read this doc:** Plain language first, then 📌 Interview term: callouts with the vocabulary interviewers listen for. Every output below was produced on Vue 3.5.44, with node for the reactivity probe and with @vue/compiler-sfc plus jsdom for the components. This page is about the *tracking model*; t

Question 7

How do , and compose in Vue 3?

Accepted Answer

**Target Audience:** Developers who already know [Transition](/interview-question/how-do-transition-and-transitiongroup-work), [KeepAlive](/interview-question/what-is-keep-alive-in-vue) and [Suspense](/interview-question/what-is-suspense-in-vue) on their own and need them to work together. **Difficulty:** Medium > **How to read this doc:** Ideas are explained in plain language first, then tagged with 📌 Interview term: so you also learn the words an interviewer listens for. The tra

Question 8

How do Transition and TransitionGroup work?

Accepted Answer

**Target Audience:** Developers comfortable with Vue templates and basic CSS transitions who want to know exactly what Vue does during an animation. **Difficulty:** Medium > **How to read this doc:** Ideas are explained in plain language first, then tagged with 📌 Interview term: so you also learn the words an interviewer listens for. The class sequences in section 4 were recorded on Vue 3.5.44 in jsdom with the repo's verify-vue-example.mjs harness. jsdom runs no CSS

Question 9

What is the difference between ref and reactive?

Accepted Answer

**Target Audience:** Developers who have written a Vue 3 component or two and want to stop guessing between ref and reactive. **Difficulty:** Medium > **How to read this doc:** Plain language first, then 📌 Interview term: callouts with the vocabulary interviewers expect. Every output below was produced on Vue 3.5.44: the reactivity probe with node, the component by compiling it with @vue/compiler-sfc and clicking through it in js

Question 10

Pinia colocation in 2025 — how do you colocate stores with routes/components?

Accepted Answer

**Target Audience:** Anyone preparing for a Vue interview who knows [what Pinia is](/interview-question/what-is-pinia-and-why-use-it) and has used lazy routes — mid-level and up. **Difficulty:** Medium > **How to read this doc:** Ideas are explained in plain language first, then tagged with 📌 Interview term: so you also learn the words an interviewer listens for. The chunk listings are real vite build output (Vite 8.3.4) of the small app whose files appear in the exam

VUE.JSDECODED.

Easy

What is Vue.js and what are its core features?

What is v-html and what is the risk of using it?

What are Vue directives? Give common examples.

How do defineProps and defineEmits work in <script setup>?

Medium

How does Vue's reactivity system work?

What is the difference between watch and watchEffect?

How do <Transition>, <KeepAlive> and <Suspense> compose in Vue 3?

How do Transition and TransitionGroup work?

What is the difference between ref and reactive?

Pinia colocation in 2025 — how do you colocate stores with routes/components?

What do defineOptions() and defineSlots() do in <script setup>?

Why use storeToRefs with Pinia?

Hard

What is async setup and top-level await?

How do you render very large lists efficiently in Vue (virtual scrolling)?

What do markRaw and toRaw do?

How does Vue's virtual DOM diff keyed lists?

How would you structure state management for a large Vue app?

What are shallowRef and shallowReactive?

When should you use shallowRef / shallowReactive / triggerRef?

What are common reactivity caveats in Vue?