The New $ref Syntax Sugar // Vue Reactivity Transform @LearnVue
The New $ref Syntax Sugar // Vue Reactivity Transform @LearnVue
Uploaded February 2022 | Updated September 2026, 15 hours ago
Ever since the introduction of the Composition API, a common issue is when to use refs vs. reactive objects. The new $ref syntax sugar is a way to eliminate the need to add .value whenever using refs.

LINKS
RFC: github.com/vuejs/rfcs/discussions/369
Docs: vuejs.org/guide/extras/reactivity-transform.html




✅ FREE VUE 3 CHEATSHEET WITH ESSENTIAL CODE SNIPPETS
learnvue.co/vue-3-essentials-cheatsheet

follow me on twitter:

twitter.com/mattmaribojoc


🚨 Like quick Vue lessons like these? Check out 800+ lessons over on Vue School - go.learnvue.co/vueschool

Music by Lukrembo
The New $ref Syntax Sugar // Vue Reactivity TransformBuilding a VUE TAG INPUT to Organize User ContentVue is getting EVEN FASTER?Nuxt + Redis in 2 Minutes??Building a Reusable Tabs Component with Vue SlotsAre You Following This Vue Best Practice?please stop making this css mistakeWhy I Love Vues Newest Featurefixing web devs config problemAstro SSR is AMAZING for working with contentI Rebuilt Wordle // Vue 3 Tutorialwhy does vite uses localhost:5173 ?
LearnVue |

The New $ref Syntax Sugar // Vue Reactivity Transform

SHARE TO X SHARE TO REDDIT SHARE TO FACEBOOK WALLPAPER