mediumFrontend

What is the difference between ref and reactive?

Q: What is the difference between ref and reactive?

`ref()` wraps any value (primitive or object) and is accessed via `.value` in script (auto-unwrapped in templates). `reactive()` makes an **object** deeply reactive without `.value` but can't hold primitives and loses reactivity if destructured. Use `ref` for primitives/single values, `reactive` for objects you keep as a whole.

1.1k views

Understand the problem

Compare ref() and reactive().

refreactive

Attempt it yourself

Sketch your approach before reading the solution — that's what interviews test.

Nudge consolestandby

Stuck? Beam a request up — the console returns a conceptual nudge that guides your logic without spoiling the implementation.

Study the solution

ref() wraps any value (primitive or object) and is accessed via .value in script (auto-unwrapped in templates). reactive() makes an object deeply reactive without .value but can't hold primitives and loses reactivity if destructured. Use ref for primitives/single values, reactive for objects you keep as

Solution ready — 2 min read

Classified // press E to declassify

Join the discussion

Discussion (0)

No responses yet. Be the first to share what you think.

Transmission complete // awaiting log

KEEP THE
STREAK ALIVE.

Dossier 15 of 70 decoded in the Vue.js track. One more won't hurt.

Back to track

Next up→

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

Continue