Pinia is a JavaScript store library for Vue.js, its purpose is to share a state across components/pages.
Questions tagged [pinia]
659 questions
28
votes
5 answers
Nuxt 3 JWT authentication using $fetch and Pinia
I'm trying to do a JWT authentication to a distinct API.
As @nuxtjs/auth-next doesn't seem to be up to date and as I read it was possible to use the new global method fetch in Nuxt 3 instead of @nuxtjs/axios (not up to date also), I thought it won't…

Claire
- 773
- 1
- 8
- 19
26
votes
3 answers
vue component doesn't update after state changes in pinia store
I'm currently working on my first vue application, currently building the login logics.
For State management, pinia is being used. I created a Pinia Store to manage the "isLoggedIn" state globally.
import { defineStore } from "pinia";
export const…

bjørn
- 263
- 1
- 3
- 4
23
votes
2 answers
Why Pinia vs Vuex for Vue 3?
I am a Vue.js developer who is coming up to speed with the the new features added to Vue 3, from Vue 2, namely the Composition API (added in Vue 3).
For State Management, it appears that along with the release of Vue 3, the community is shifting…

Kobi
- 4,003
- 4
- 18
- 23
23
votes
5 answers
Vue: Can't access Pinia Store in beforeEnter vue-router
I am using Vue 3 including the Composition API and additionally Pinia as State Management.
In the options API there is a method beforeRouteEnter, which is built into the component itself. Unfortunately this method does not exist in the composition…

Josh
- 294
- 1
- 2
- 11
21
votes
6 answers
How to set the type for the state object in pinia?
I'm making a chess game and I am using Vue 3 and TypeScript with Pinia for the state management.
I want to do something like the following:
export const useStore = defineStore("game", {
state: () => {
return {
moves: [],
gameBoard:…

avenmia
- 2,015
- 4
- 25
- 49
20
votes
6 answers
Can't use vue-router and pinia inside a single store
I am using pinia and vue-router 4.x ,but i am having a problem using both of them in a store.
each works independently ,but not together.
If i use
import router from '../router'
router will work but pinia is failed with error
Uncaught…

SeyT
- 773
- 1
- 10
- 23
18
votes
2 answers
How to subscribe to a specific action in Pinia
Does anyone know if it's possible to subscribe to a specific action in Pinia?
I know there's a way to subscribe to all actions like this:
const subscribe = someStore.$onAction(callback, false)
But that means I have to compare action name to the one…

Marek Miś
- 259
- 2
- 8
14
votes
4 answers
Cannot find module 'pinia/dist/pinia.mjs' when using run dev
I setup Pinia on top of fresh Nuxt3 app and start dev server, with exactly these commands in order:
npx nuxi init nuxt-app
cd nuxt-app
npm install
npm install @pinia/nuxt
npm run dev
Dev server runs without any problem. Then, i put this line of…

Clarity
- 186
- 1
- 7
14
votes
4 answers
Vue3 | Pinia - Watching storeToRefs in composable function does not work
I'm trying to understand the purpose of composables. I have a simple composable like this and was trying to watch state from a Pinia store where the watch does not trigger:
import { ref, watch, computed } from "vue";
import { storeToRefs } from…

Riza Khan
- 2,712
- 4
- 18
- 42
13
votes
1 answer
Nuxt 3 - Pinia Vs useState()
Store (Pinia) Vs UseState
If I am not mistaken, useState can replace any store like Pinia? Given that useState makes ref sharable across all components I have a hard time knowing if I should use a store or a useState ref. For instance, let's say I…

AhmadReza
- 421
- 6
- 20
10
votes
1 answer
How to correctly handle information fetch from an API with Pinia in Vue.js 3?
I'm currently working on a project where to fetch data from an API.
I need access to that data all over my app, so I thought that the best option was to use Pinia (usually I used Vuex, but I want to try this "new" store solution).
My "problem" is…

yerigagarin
- 137
- 1
- 1
- 6
10
votes
3 answers
How to use Pinia outside a component in js file
I am migrating from vue 4.x to pinia, one of my file needs api key from store.
But I can't make it work even though I follow the Pinia documentation .
here is how I use pinia
// Repository.ts
import axios from "axios";
import { createPinia } from…

SeyT
- 773
- 1
- 10
- 23
9
votes
2 answers
how to reset one of data in pinia state?
I have a design in setting page,every one of them hava reset button, now i using pinia to be store library.
I kown $reset is reset the whole pinia state,so,how to reset one of data in pinia state?

Zssaer
- 193
- 1
- 2
- 6
9
votes
2 answers
Pinia getter does not update
I have following code