How to access Pinia Store from another Store
2 years ago
admin
Vuejs
Sometimes you need to access a Pinia store from another store to perform other actions, so let's see how we can do that.
Create the first pinia store (useProfileStore)
Let's assume that we have two stores useAuthStore and useProfileStore and we want when the user login we set the currentUser inside the useProfileStore state.
First, create the useProfileStore:
import { defineStore } from 'pinia';
export const useProfileStore = defineStore('profile', {
state: () => ({
currentUser: null
}),
getters: {
getCurrentUser: (state) => state.currentUser,
},
actions: {
setCurrentUser(user){
this.currentUser = user;
}
}
});
Create the second pinia store (useAuthStore )
Next, create the useAuthStore and import the useProfileStore and we use it inside the login action to set the current user.
import { defineStore } from 'pinia';
import { useProfileStore } from '@/store/useProfileStore';
export const useAuthStore = defineStore('auth', {
state: () => ({
isLoggedIn: false,
}),
getters: {
getLoggedInstatus: (state) => state.isLoggedIn,
},
actions: {
async login(user) {
try {
const response = await axios.post('/api/user/login',{
email: user.email,
password: user.password,
});
if(response.data.success){
this.isLoggedIn = true;
const profileStore = useProfileStore();
profileStore.setCurrentUser(response.data.user);
this.router.push({ name: 'home' });
}else{
console.log(response.data.message);
}
} catch (error) {
console.log(error);
}
},
},
});