Vue 3 Reactive vs Ref

preview_player
Показать описание
Vue 3 Reactive vs Ref by using the Composition API. This video takes a closer look at reactive data. There are basically two ways on how you can create reactive data with the Composition API and one question that keeps coming up is when we can use Ref and Reactive to declare a reactive data property. Or what is better? Using Ref or Reactive? Stick around!

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
⏩ Table of Contents
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

0:00 What's happening
0:58 Why reactive data?
2:41 Using Ref and Reactive
5:03 Reactive vs Ref

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
⭐ That might interest you too
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
🎓 Tutorials for Beginners and Advanced
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
👫 Support
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
📣 Social Media and Websites
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
📌 About Channel/Me
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Copyright by Mario Laurich / webnoob

#vuejs #vue3 #webnoob
  1. Webnoob
  2. mario laurich
  3. webnoob
  4. vue js
  5. vue js tutorial
  6. vue js project
Рекомендации по теме
When to Use 0:02:43

When to Use Ref vs. Reactive // Vue Tips

Vue 3 ref 0:05:50

Vue 3 ref and reactive pros and cons

Stop Using .value 0:14:22

Stop Using .value with ref In Vue 3! Reactivity Transformed Explained!

Reactivity in Vue 0:09:47

Reactivity in Vue 3 - How does it work?

Vue 3 Reactive 0:13:08

Vue 3 Reactive Data | Ref Vs Reactive in 10 Minutes! (ish)

Vue 3: Reactivity 0:13:04

Vue 3: Reactivity Made Easy (ref, reactive, toRefs... oh my!)

Vue js Composition 0:00:34

Vue js Composition API Ref vs Reactive #shorts

Vue 3 Reactivity 0:13:13

Vue 3 Reactivity | Ref vs Reactive

How Real Madrid 6:13:10

How Real Madrid Became The Richest Club In The World

Coding Shorts: Making 0:13:10

Coding Shorts: Making Sense of reactive() and ref() in Vue.js

Vue 3 Reactive 0:08:21

Vue 3 Reactive vs Ref

Ref vs Reactive 0:06:43

Ref vs Reactive - Vue 3 Composition API | Vue.js 3 Tutorial

Vue 3 Composition 0:28:53

Vue 3 Composition API: Ref vs Reactive

Vue Template Refs 0:04:24

Vue Template Refs Simplified

Vue 3 Composition 0:08:42

Vue 3 Composition API Tutorial #2 - Data, Refs & Reactive Objects

109. Understand Template 0:07:05

109. Understand Template Ref & Reactive ref in the Composition API in Vue js 3 | Vue 3.

Are You Following 0:02:43

Are You Following This Vue Best Practice?

Fundamentals of Reactivity 0:04:37

Fundamentals of Reactivity in Vue 3

Master Vue: Merge 0:00:28

Master Vue: Merge Ref & Reactive! #VueJS

Vuejs Crash Course 0:17:01

Vuejs Crash Course 2024 | Ref, Reactive, Computed | Reactivity

The New $ref 0:03:29

The New $ref Syntax Sugar // Vue Reactivity Transform

Write Reusable Code 0:02:19

Write Reusable Code with toREFS in Vue 3

7 Important Vue 0:06:25

7 Important Vue 3 Composition and Composable Functions Explained

ref() vs reactive(), 0:05:50

ref() vs reactive(), lequel utiliser ? — Développement d'une application en VueJS 3

Комментарии
Автор

Jetzt hat es endlich auch mal klick gemacht, was dieses ref() in der composition api ist. Danke Mario und Grüße aus Leipzig :)

lukasluftlaufer
Автор

Great explanation! Short and direct to the point. Thanks Mario!

rafapioli
Автор

This is a very good example about ref and reactive, now I underdstand the differences, thank you mario for the explanations !!!

maskman
Автор

2:30 Of course it didn't work, you tried to re-assign a constant ;)

jeffrey
Автор

This video and that one were realy useful for me. Thanks!

МихаилПетровичЗубенко-рв
Автор

7:06 but you can also put an object inside ref(), so your argumentation kind of falls flat.
As far as I can tell, the only downside is that you have to write `.value` every time you want to access a property of it.
Well, in my opinion it's not that bad, because since we have to do that with primitive types anyway, it at least is consistent.

dasten
Автор

great video really help me clear thing about ref and reactive.

MarkKevinBesingaWebDev
Автор

Can i import this as a global, or its a nice practice just import it on every components, Thank you!

kobekobz
Автор

Hello! I love your videos. I try to use REF like an object and is working. If i understand fine you say that REF can't be an object, and is working for me. Just commment :)
I'm from Argentina and sometimes i don't understand well some words.
Thanks for the video!! I lear how to use reactive

cmlaplatacommunitymanagerl
Автор

10 Euro wette du kommst aus Sachsen wie ich :D Danke fuer das video

hago
Автор

Where r u from dude? what happen with ur accent

abdi_pie