MENU

Fun & Interesting

Props and Emitters in Vue 3 (FULL TUTORIAL)

VueReference 21,963 2 years ago
Video Not Working? Fix It Now

Passing props to child components and creating emitted events is a staple of functionality for Vue 3 components. Using the composition API, we pass props containing data to a child. We also emit using a button from a child component to delete components. This Vue 3 props tutorial gives you the basics for creating 2-way communication between your components with props and emitters. 0:00 - Introduction 0:31 - Starter Project 0:59 - Register a component 1:44 - Passing and defining a prop 3:09 - Passing Multiple props 6:54 - Printing out multiple components with data 8:17 - Creating emitters to delete cards 14:06 - Useful documentation for emitters and props **** Join Free Course Waitlist **** https://vuereference.com/free-course **** Finished code **** https://github.com/BrianDriscollCode/components_and_props_emitters_video_0005/tree/main **** Get Starter Application to Follow Along **** Create a folder then: 1. Copy into console: git clone -b starter https://github.com/BrianDriscollCode/components_and_props_emitters_video_0005.git 2. cd or open the folder that is created 3. Copy into console: npm install 4. Start application: npm run dev *** Vue 3 Documentation *** Props - https://vuereference.com/documentation/fundamentals/props Emitted Events - https://vuereference.com/documentation/fundamentals/emitted-events Ref and Reactive - https://vuereference.com/documentation/fundamentals/ref-and-reactive Event Handling - https://vuereference.com/documentation/fundamentals/event-handling *** Professional Inquiries *** Email me: [email protected]

Comment