State Management with Composition API
summary
Demonstrates replacing Vuex in small apps by using the Composition API reactivity primitives to build a working dashboard: a local composable useItems with ref computed readonly for immutability, a global store by hoisting a top‑level ref plus provide/inject, and a folder‑based store pattern that mirrors Pinia. Shows TypeScript casting pain with inject, a case where UI didn’t update until state was truly global, and then integrates Pinia to show Pinia devtools timeline and clearer action tracing.
AI-written summary · about
chapters (14)
- 0:00Introduction
- 1:08Talk goals with Composition API
- 2:10Demo app walkthrough
- 3:54Migrating to script setup
- 7:23Composable functions for state
- 8:46Adding feature with composables
- 10:10State to dedicated composable
- 11:57Global state with ref
- 14:06Pinia for store-like state
- 15:55Provide/inject for global state
- 17:20TypeScript with provide/inject
- 19:46Pinia vs provide/inject
- 20:48Demo of Pinia
- 22:13Summary
