In this 14 minute video, I'll walk you through as I convert an existing Vue component from the Options API to the newer Composition API. I created a basic e-commerce shopping cart with the Options API, containing props, methods, and computed properties. In this high-level overview, I transform that component to use the Composition API, which has a drastically different code structure (but one that I think you'll enjoy).
You'll learn:
- What script setup does
- The difference between ref and reactive
- How to create methods and computed properties
- Why to switch to the Composition API
- 0:00 Intro
- 02:10 Getting started with setup()
- 03:33 Introducing ref and reactive
- 05:11 Using script setup
- 06:32 Including props
- 07:02 Adding methods
- 09:22 Including computed properties
- 11:38 Why use the Composition API
- 14:09 Wrapping up
Follow me on Twitter! / aschmelyun
Join my newsletter, where I send out new information twice each month in the PHP, JavaScript, and Docker worlds: aschmelyun.substack.com
4 июл 2024