Vue JS Vue JS State Management 2

Question 1

What Vuex helper maps store state properties directly to component computed properties?

Accepted Answer

mapState()

Answer

mapState() is a Vuex helper that creates computed properties in a component that return the corresponding state values from the store.

Question 2

How do Vuex modules help manage large applications?

Accepted Answer

They allow state, mutations, actions, and getters to be organized into separate namespaced modules

Answer

Vuex modules divide the store into encapsulated sections with their own state, mutations, getters, and actions to prevent a single massive store.

Question 3

What is the purpose of Pinia's storeToRefs() function?

Accepted Answer

Destructures store state and getters into refs while keeping reactivity

Answer

storeToRefs() lets you destructure reactive refs from a store without losing reactivity, similar to toRefs() for reactive objects.

Question 4

In Vuex, what is the difference between getters and state?

Accepted Answer

State is mutable; getters are cached computed values derived from state

Answer

State holds the raw reactive data, while getters are like computed properties that derive and cache values from state, recalculating only when dependencies change.

Question 5

How do you dispatch a Vuex action from inside a Vue component?

Accepted Answer

this.$store.dispatch('actionName', payload)

Answer

Actions are dispatched with this.$store.dispatch(), optionally passing a payload as the second argument, and they return a Promise.

Vue JS Practice Test

Vue JS Practice Test

Vue JS Vue JS State Management 2