Vue JS Vue JS State Management

Question 1

What is the primary purpose of Pinia in a Vue 3 application?

Accepted Answer

Centralized state management store

Answer

Pinia is the official Vue 3 state management library that provides centralized, reactive stores with a simpler API than Vuex.

Question 2

In Pinia, what is the difference between state, getters, and actions?

Accepted Answer

state holds data, getters are computed values, actions contain logic/mutations

Answer

state is the reactive data, getters are cached computed properties derived from state, and actions are methods that can be synchronous or asynchronous.

Question 3

How do you define a Pinia store using the Options API style?

Accepted Answer

const useMyStore = defineStore('myStore', { state: () => ({}), getters: {}, actions: {} })

Answer

defineStore() accepts a unique store id and an options object with state, getters, and actions, returning a composable use function.

Question 4

How do you access a Pinia store inside a Vue 3 component?

Accepted Answer

const store = useMyStore() inside setup()

Answer

You call the composable returned by defineStore() inside a component's setup() function to get the reactive store instance.

Question 5

Which Pinia method allows you to patch multiple state properties at once?

Accepted Answer

store.$patch()

Answer

$patch() accepts an object of partial state updates or a mutation function, updating multiple properties efficiently in one operation.

Vue JS Practice Test

Vue JS Practice Test

Vue JS Vue JS State Management