Vue JS Cheat Sheet 2026

The 30 highest-yield Vue JS facts, distilled from real exam questions. Print it, save it as a PDF, or study it here — free, no sign-up.

1. How do you pass props to a route component using Vue Router's props option? → Set props: true on the route to pass route.params as component props
2. How can a child component access content passed in its default slot programmatically in Vue 3? → Both A and B are correct
3. Can you call multiple instances of the same lifecycle hook in Vue 3 Composition API? → Yes — you can call onMounted multiple times and all callbacks will execute
4. Which official Vue library is used to mount and test Vue components in isolation? → @vue/test-utils
5. What does a computed property provide over a method? → Cached results that update only when dependencies change
6. How do you programmatically access slot content in the Vue Options API? → Via this.$slots.slotName
7. An object that specifies the operations that will be blocked. → Handler
8. In Vue 3, which of the following best describes one-way data flow for props? → Props flow from parent to child; child should not mutate them
9. Which prop modifier in Vue 3 makes `v-model` work on a custom component with a non-default prop name? → v-model:propName
10. How should asynchronous component behavior (e.g., API calls in setup()) be tested with @vue/test-utils? → Mock the async call, await flushPromises() after mounting, then assert the updated DOM
11. In Pinia, how do you reset a store's state to its initial values? → store.$reset()
12. How do you implement cross-field validation (e.g., password confirmation) in Vue 3? → Both A and C are valid approaches
13. Which Vue Router 4 feature allows you to lazy-load route components to improve initial bundle size? → Dynamic import() in the component field
14. In Pinia, what is the difference between state, getters, and actions? → state holds data, getters are computed values, actions contain logic/mutations
15. How does a parent access data from a scoped slot? → {{ slotProps.item }}
16. How do you create two-way binding on a custom component? → Use v-model on the component
17. What is the recommended way to initialize a third-party JavaScript library that needs a DOM element in Vue 3? → Initialize it inside onMounted using a template ref to target the DOM element
18. What is the correct way to pass static text into a child component prop? → message="hello"
19. Which Vue 3 utility converts a reactive object into a plain object with computed refs for each property? → toRefs
20. How do you implement async validation (e.g., checking if a username is taken) in Vue 3? → Use a debounced watcher on the field, call the API, and store the error in a ref
21. How does Vuex handle asynchronous operations like API calls? → Through actions, which can be async and then commit mutations
22. Which keyword is used in Vue 3 Composition API to declare props inside ``? → defineProps
23. In Vue 3, how do you access a template ref (DOM element) inside a lifecycle hook? → Both A and C are correct
24. In Pinia, how do you reset a store's state back to its initial values? → store.$reset()
25. What is the recommended approach to avoid expensive computations running on every render in Vue? → Use computed() to cache the result until reactive dependencies change
26. Which event modifier is only applied to stop clicks on the element itself? → @click.self.prevent
27. How do you register a child component locally within a parent component? → With the components option
28. What is the purpose of a slot in a Vue component? → To allow parents to inject content into a child's template
29. What is the difference between state and getters in Pinia? → State holds raw reactive data; getters are computed properties derived from state
30. What does Vue recommend regarding shorthand vs full names for slot directives? → Use the # shorthand consistently for named slots