Vue.js / Nuxt.js

Vue Reactivity

Reactivity system, reactive vs ref, toRef, toRefs, unref, shallow reactivity, readonly

20 pytań z rozmów·
Mid-Level
1

What is Vue's reactivity system?

Odpowiedź

Vue's reactivity system automatically detects changes in data and updates the DOM accordingly. It relies on JavaScript Proxies that intercept property access and modifications. This system ensures the user interface stays synchronized with the application state without manual intervention.

2

What is the main difference between ref() and reactive()?

Odpowiedź

ref() creates a reactive reference for a primitive value or object, accessible via .value, while reactive() creates a reactive proxy of an object without requiring .value to access properties. ref() is universal (primitives + objects) and ideal for simple values, while reactive() is optimized for objects but doesn't work with primitives. In practice, ref() is often preferred as it works with all types.

3

How to access the value of a ref in the template vs in the script?

Odpowiedź

In the template, Vue automatically unwraps refs, allowing direct access without .value (e.g., {{ count }}). In the script, you must use .value to read or modify the ref's value (e.g., count.value++). This automatic behavior in templates simplifies code writing while maintaining explicit control in JavaScript logic.

4

What happens if you destructure a reactive() object?

5

What is the purpose of toRefs() in Vue?

+17 pytań z rozmów

Opanuj Vue.js / Nuxt.js na następną rozmowę

Uzyskaj dostęp do wszystkich pytań, flashcards, testów technicznych, ćwiczeń code review i symulatorów rozmów.

Zacznij za darmo