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

With Vue 3 now being the official version of Vue, I thought we would look at one of the few significant changes with the addition of the composition API, which is creating data and making it reactive
-----------------------------------------------------------------------------------------------------
Join my channel to support me to continue doing what I love!
-----------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------------
Timestamps:
0:00 Introduction to vue data
1:15 Creating data
2:15 Update data
3:30 Make data reactive with ref()
7:30 Make data reactive with reactive()
9:45 Limitations of using reactive()
12:10 Conclusion, what should you use?
-------------------------------------------------------------------------------------------------------
#vue #vue3 #vue3refsvsreactive #vuereactivedata
Current Subscribers: 7,040

[JohnKomarnicki]

Now that Vue 3 is the official version of Vue, is there any other topics / features you'd want me to cover?

[MRRGERS]

@John Komarnicki you can infact reassign values of an object that was declared with reactive. `Object.assign(target, object)` will either add a nonexistent property or update the value of an existing property.

[dangerzone-]

Please create a complete e-commerce project(home page, category page with filter system, product page, cart page etc), with all features using firebase.
Obviously based on vue 3. Hope to see you soon with this project.

[despertaweb]

You're stating a very important point here, often missed: "Reassigning objects is possbile with Ref."
That means you can destructure an object into a reactive REF one and bulk in there the props with it's values. Also alows to add new ones!

[universecode]

Composition Api is great, I'm learning Vue.js 👍🏻 Nice John 😄

[epotnwarlock]

What I hate about Vue: examples dont use <script setup> and it's never in Typescript

Btw i like the video

[shellysclan]

please explain what is proxy and why we get value as proxy instead of object

[cswalker]

Cool, thanks, this clears things up.

[djproductions]

Isn't the error you're getting at 11:35 because personTwo is defined as const? Would you still get that error if you define personTwo with let instead of const?

[amitdev]

Vuejs3 best practice for properly building a project..

[jampy]

I would like to know how to work with async func passing props between components :D

[dasten]

Sigh! This video started promising but well.... yepp, that's what everyone says: "There are situations when using reactive instead of ref is a good choice". But nobody wants to show me these situations.
So far, since I really don't think having to write .value is such a bad thing, I only see downsides of using reactive. I can't think of _any_ reason to use it at all and I can't think of or find an example where it actually does something that ref doesn't do.... :( This is very frustrating! I want to know why it exists! It can't be just to omit .value, can it??

[chatif]

John please make some more vue3 firebase9 🔥 tutorials

[gaurangdodiya-ycpe]

Hey i am From India.
Please teach Vue Js Full Courses.