Skip to content
← Todas las preguntas
Principiante

¿Qué es Pinia y en qué se diferencia de Vuex?

Gestión de estado

Pinia es el store oficial de Vue 3 (reemplaza a Vuex). Diferencias clave:

VuexPinia
MutationsSí (obligatorias)No existen
TypeScriptSoporte limitadoSoporte nativo
StoresMódulos dentro de 1 storeStores independientes
SintaxisOptions o SetupOptions o Setup
DevTools
ComposiciónCompleja (módulos con namespace)Simple (importar y usar)
ts
// Store de Pinia
import { defineStore } from 'pinia'
import { ref, computed } from 'vue'

export const useCartStore = defineStore('cart', () => {
  const items = ref<CartItem[]>([])
  const total = computed(() => items.value.reduce((sum, i) => sum + i.price, 0))

  function addItem(item: CartItem) {
    items.value.push(item)
  }

  return { items, total, addItem }
})

Publicado bajo la licencia MIT.