(1/12) Which statement about watchers created with watchMulti() in Vue 3 is correct?

---

• They are identical to watchers in Vue 2
• watchMulti() is for route watchers only
• watchMulti() does not exist in Vue 3; instead, you pass an array of sources to watch() or watchEffect
• You must define watchers in main.js for multi-sources

(2/12) How can you detect if a Composition API component has unmounted so you can avoid calling setState in an async callback, for example?

---

• Use a boolean ref, and in onUnmounted set it to true; check it in your async callback
• Vue 3 doesn’t allow detection of unmount
• Use watchers to see if it’s unmounted
• Use defineProps for unmounting

(3/12) Which approach might you take if you want to run an async operation before your Vue 3 component fully renders, yet still show a fallback if the operation is slow?

---

• No approach for fallback is provided in Vue 3
• Use watchers to block rendering
• Wrap the component in <Suspense>, define an async setup or defineAsyncComponent, and show a fallback slot while loading
• Put the entire async operation in defineEmits

(4/12) Which statement about concurrency watchers is correct if you define them inside a custom plugin that injects watchers into every component globally in Vue 3 via app.mixin?

---

• Impossible to inject watchers with mixins in Vue 3
• Use watchers in main.js for concurrency watchers only
• Use defineProps for concurrency watchers
• A global mixin can define hooks or watchers in the beforeCreate/created stage for each component, but concurrency logic must handle each instance’s onInvalidate individually. This is advanced and can lead to confusion

(5/12) What does the <keep-alive> component do in Vue 3?

---

• Caches inactive component instances to preserve state and avoid re-rendering
• Forces components to fully re-render on every update
• Enables real-time data binding with the server
• Causes watchers to never stop observing changes

(6/12) Which advanced approach might you adopt to handle custom prop validation that depends on watchers in a child, hooking into the parent's lifecycle in Vue 3?

---

• You can do normal prop validation or watchers in the child. For hooking into the parent’s lifecycle, you might rely on a custom plugin or injection. There's no direct parent-lifecycle call from the child watchers without an external mechanism
• Impossible to validate props with watchers
• Use defineProps for concurrency watchers
• Use watchers in main.js for concurrency watchers only

(7/12) Which statement about watchers referencing a shallowRef object is accurate in Vue 3, if you mutate fields within shallowRef.value?

---

• It triggers watchers for every field mutation
• Use defineProps for concurrency watchers
• Use watchers in main.js for concurrency watchers only
• No watchers trigger unless you reassign shallowRef.value to a new reference, ignoring internal field changes

(8/12) How do watchers handle concurrency if the user triggers quick route changes in Vue 3, referencing an async callback in watch(() => route, ...)?

---

• Each route change calls the watch callback. If you define an async call, you can do onInvalidate to cancel the old call if a new route arrives rapidly
• Use defineExpose for concurrency watchers
• No concurrency approach for route watchers
• Use watchers in main.js for concurrency watchers only

(9/12) Which advanced approach can you use if you want to define watchers for concurrency in a single-file component that merges logic from multiple <script> blocks (one <script> and one <script setup>) in Vue 3?

---

• It’s possible but complex. The <script> (Options API) watchers and <script setup> watchers remain separate in each block. If you need concurrency bridging, you'd share references or a global effect scope. This is highly advanced and potentially confusing
• Use watchers in main.js for concurrency watchers only
• Impossible to have watchers in both blocks
• Use defineProps for concurrency watchers

(10/12) When migrating from Vue 2 to Vue 3, which official tool can help detect usage of deprecated APIs in a runtime environment?

---

• Only the router devtools handle migrations
• vue-inspector plugin
• The Vue 3 migration build, which logs warnings for deprecated features
• No official tool exists

(11/12) Which statement is correct about removing watchers in Vue 3 Composition API?

---

• Watchers never clean up unless you call a manual stop function on them
• They automatically stop when the component is unmounted, or you can call the returned stop() function if you stored it
• You must remove watchers in onBeforeUnmount by referencing watch IDs
• Watchers are immutable in Vue 3

(12/12) Which approach do you use to register a global error-handling callback for unhandled rejections or thrown exceptions in a Vue 3 app?

---

• Add an error property to the app instance with app.error()
• Write watchers for every possible error scenario
• Use config.errorHandler on the app instance, or a top-level onErrorCaptured in the root
• Vue 3 no longer supports global error handling

Submit