Episode 55: New in Vue 3: Emits with Alex Riviere

Key Points From This Episode:
- Introducing today’s returning guest, Alex Riviere.
- Today we ask: what is Vue 3’s emits component option?
- What it means to pass a callback function as a prop.
- Alex contrasts callbacks and promises.
- The best way to consider what a callback is.
- New offerings that come with Vue 3’s emits option.
- Why emits options will be useful to editors and developers.
- Alex tells us when and where you can find perfect conditions for passing on props.
- Some limitations that come with the emits option.
- How emit is evoked in Vue 2 versus and the changes that have come with Vue 3.
- Stay tuned for this week’s top picks.
Tweetables:
- “My understanding is that emitting in Vue is the way that you pass data from a child component to its parent. It allows you to create your own events and you can use it wherever you want to, in a component to emit some data backup to its parent.” — @fimion [0:03:23]
- “I think, it may also be that you don't necessarily need the information directly from callbacks, but you need that information available for something else that would happen.” — @fimion [0:14:56]
- “If you're looking at a Vue like a page, where all you care about is what the template layout of it is, I feel that's more important to be at the top than the script.” — @fimion [0:18:40]
- “Since emit does not return a value, you can't actually run validations through emit.” — @fimion [0:33:12]
Resources mentioned:
- Enjoy the Vue on Twitter (https://twitter.com/enjoythevuecast?lang=en)
- Enjoy the Vue (https://enjoythevue.io/)
- Alex Riviere on Twitter (https://twitter.com/fimion?lang=en)
- Alex Riviere on GitHub (https://github.com/fimion)
- Alex Riviere on CodePen (https://codepen.io/fimion/pens/popular)
- Alex Riviere Blog (https://alex.party/)
- Anthony Alicea (https://twitter.com/anthonypalicea?lang=en)
- Ionic (https://ionicframework.com/vue)
- Vue 2 docs - Emitting a Value With an Event (https://vuejs.org/v2/guide/components.html#Emitting-a-Value-With-an-Event)
- Vue 3 docs - Component Custom Events (https://v3.vuejs.org/guide/component-custom-events.html#event-names)
- Learn and Understand NodeJS, Anthony Alicea (Udemy) (https://www.udemy.com/course/understand-nodejs)
- In The Loop, Jake Archibald (JSConf.Asia) (https://www.youtube.com/watch?v=cCOL7MC4Pl0)
- Tony and Chelsea Northrup (https://www.youtube.com/channel/UCDkJEEIifDzR_2K2p9tnwYQ)
- Mediocre: The Dangerous Legacy of White Male America, Ijeoma Oluo (https://bookshop.org/books/mediocre-the-dangerous-legacy-of-white-male-america/9781580059510)
- Fire Emblem: Three Houses - Cindered Shadows DLC (Nintendo Switch) (https://fireemblem.nintendo.com/three-houses/downloadable-content)
- Mutual Aid Hub (http://mutualaidhub.org)
- Manhunt Deadly Games (https://www.rottentomatoes.com/tv/manhunt/s02)
- Street Food Asia (https://www.imdb.com/title/tt10050778/)
- Obsidian (https://obsidian.md/)

Key Points From This Episode:

Introducing today’s returning guest, Alex Riviere.
Today we ask: what is Vue 3’s emits component option?
What it means to pass a callback function as a prop.
Alex contrasts callbacks and promises.
The best way to consider what a callback is.
New offerings that come with Vue 3’s emits option.
Why emits options will be useful to editors and developers.
Alex tells us when and where you can find perfect conditions for passing on props.
Some limitations that come with the emits option.
How emit is evoked in Vue 2 versus and the changes that have come with Vue 3.
Stay tuned for this week’s top picks.

Tweetables:

“My understanding is that emitting in Vue is the way that you pass data from a child component to its parent. It allows you to create your own events and you can use it wherever you want to, in a component to emit some data backup to its parent.” — @fimion [0:03:23]
“I think, it may also be that you don't necessarily need the information directly from callbacks, but you need that information available for something else that would happen.” — @fimion [0:14:56]
“If you're looking at a Vue like a page, where all you care about is what the template layout of it is, I feel that's more important to be at the top than the script.” — @fimion [0:18:40]
“Since emit does not return a value, you can't actually run validations through emit.” — @fimion [0:33:12]

Resources mentioned:

Enjoy the Vue on Twitter
Enjoy the Vue
Alex Riviere on Twitter
Alex Riviere on GitHub
Alex Riviere on CodePen
Alex Riviere Blog
Anthony Alicea
Ionic
Vue 2 docs - Emitting a Value With an Event
Vue 3 docs - Component Custom Events
Learn and Understand NodeJS, Anthony Alicea (Udemy)
In The Loop, Jake Archibald (JSConf.Asia)
Tony and Chelsea Northrup
Mediocre: The Dangerous Legacy of White Male America, Ijeoma Oluo
Fire Emblem: Three Houses - Cindered Shadows DLC (Nintendo Switch)
Mutual Aid Hub
Manhunt Deadly Games
Street Food Asia
Obsidian

Support Enjoy the Vue