#14 - Component Props - Vue 3 Tutorial

In this Vue 3 tutorial, we learn how to pass data from one component to another down the tree with props. We cover the steps to create and use props, dynamic & default values, prop types, non-prop attributes and how to specify that a prop is required.

We cover the following topics:
1. What are component props
2. How to add a prop to a component
3. How to use multiple props on a single element
4. Multi-word prop name casing
5. How to assign dynamic values to props with v-bind
6. How to specify a soft prop type
7. How to specify that a prop is required
8. How to set a default value for a prop
9. Non-prop attributes

Note that this tutorial is for the Vue 3 Options API (which is similar to Vue 2). We later move on to the Composition API and then the Script Setup (3.2 update)

This lesson is also available in written format
https://www.koderhq.com/tutorial/vue/...

Check out the Vue 3 for Beginners playlist for more Vue tutorial videos
Vue 3 for Beginners

Subscribe to the channel and never miss a lesson
@koderhq

Visit the website for a wide range of programming tutorials
https://www.koderhq.com

• #education
• #vue
• #vue_3
• #vuejs
• #vuejs_3
• #vue_for_beginners
• #vue_tutorial_for_beginners
• #vuejs_for_beginners
• #prop
• #props
• #component_props
• #prop_type
• #required_prop
• #default_prop
• #props_and_v_bind