Questions tagged [pinia]
Pinia stands out as a cutting-edge JavaScript store library designed specifically for Vue.js, enabling seamless sharing of state data among various components and pages.
One challenge I've encountered involves a function within my Pinia store: async function getCurrentUser(){ let user: User | undefined = undefined; if (auth.currentUser?.uid) { user = await getUserById(auth.currentUser.uid) state.va ...
Currently, I am in the process of developing an application using Quasa V2 framework, vue, vite, pinia, and format. One of the components in my app is basicList.vue, which retrieves its control attributes and properties from a pinia store named oTable. By ...
Below are the code snippets I'm working with: Test.vue <template> <button v-show="store.common == 'hi'" @click="func"> hello world </button> </template> <script setup> import {mainStore} from './i ...
When attempting to utilize useLocalStorage from pinia, I am encountering an issue where the data in the store's state is not fetched from local storage and instead defaults to the default value. Below is the code snippet from my store method: import { use ...
I'm looking to update the page direction in Pinia whenever a value changes, and while my code is functioning correctly, it reloads the page which I want to avoid. Take a look at my App.vue <script setup> import { useaCountdownStore } from "./st ...
As I embark on my journey with Vue 3 and Pinia, a particular question has been lingering in my mind without a concrete answer thus far. Let's delve into the crux of the matter... Here's an example of the store I am working with: import { ref, computed } f ...
I'm currently setting up an authentication store using Firebase, and I want to direct users to the login/logged page based on their authentication status. My goal is similar to this implementation: https://github.com/dannyconnell/vue-composition-api-cours ...
I am currently facing an issue with a simple counter store in pinia. The counter itself updates and displays correctly on the page, however, when trying to use the count in a specific function, it does not reflect the updated state of the counter store. Ho ...
I am currently developing a website that showcases a range of products with dedicated product pages. However, I am facing challenges in determining the optimal sequence for loading data. While I could make an axios call and pass the data as a prop to subse ...
I tried following the instructions provided in this pinia persisted state plugin guide, but I am encountering an issue where my states reset on page refresh. Could there be a problem with my configuration? // nuxt.config modules: [ [ "@pinia/nux ...
In my accountsList.vue file, I have a script where I've commented out a lot of code for a serious refactor. The "balance" variable is properly set and has a value, as confirmed by checking it. <script setup> import Account from "@/Pages/Partials ...
Having trouble using Pinia in Nuxt 2.15.8 and Vue 2.7.10 with Typescript. I've tried numerous methods and installed various dependencies, but nothing seems to work. After exhausting all options, I even had to restart my main folders on GitHub. The dependen ...
I've hit a wall. Despite scouring documentation and countless google searches, I can't seem to find the answer to this straightforward query: how do I install/import PINIA in a VUE application? Let's consider a basic VUE app: <div id=&qu ...
My app was developed using vitesse-nuxt3, and everything is working smoothly except for my attempt to use LocalStorage with the help of vueuse. Component: <script setup lang="ts"> const { test } = useTestStore() </script> <templa ...
While delving into Vue and Pinia, I encountered a data management issue on the user side. On my main page, I showcase categories and auction items. However, upon navigating to a specific category in the catalog, the data for auction items remains in the st ...
I am attempting to retrieve the value of the i18n locale language from my pinia store, however, an error is occurring Uncaught Error: [ ...
Within my todosStore pinia store, I am implementing CRUD operations against the backend. To achieve this functionality, I require a separate pinia store called bannerStore for updating the message and class of the bootstrap alert component in the template. ...
Looking to dive into the world of Nuxt3. As far as I know, it employs universal rendering, blending elements of CSR and SSR. But before embarking on this journey, a couple of queries are on my mind. How does Nuxt3 differentiate between client-side and s ...
Is it necessary to type the Store when importing it to TypeScript in a Pinia Vue project? // Component <p>{{ storeForm.firstName }}</p> // receiving an error "Property 'storeForm' does not exist on type" // Store ...
My Vue 3 Single Page Application is built on Vite 4.2 and TypeScript 5.02. When I click to select a language, it emits lang.value and in the parent component App.vue, contentStore should update the content. It works flawlessly on my Linux Ubuntu desktop i ...
I am currently working on a Vue.js 3 project where I need to utilize a global axios instance in some .vue components and also in a pinia store. Within my main.js file, I have configured axios globally like so: const axiosInstance = axios.create({ base ...
I have a frontend built with vue3 and using pinia as the store. I am setting it up as shown below: export const useShopStore = defineStore( "shop", () => { const state = reactive({ data: { fruits: [], owners: [] ...
I have been working on my Vue.js application and I am looking to implement some helper functions that will utilize a Pinia store within the app. These functions need to be accessible by multiple components. Should I define these helper functions directly ...
I'm currently working on implementing pinia state management in Vue 3, but I've encountered the following error: Module not found: Error: Can't resolve 'src/stores/cart' in 'C:\Users\Ali Haider\theme-project&b ...
How can I display the retrieved 'data' from a useAsyncData function that fetches information from a pinia store? <script setup lang="ts"> import { useSale } from "~/stores/sale"; const saleStore = useSale(); const { da ...
Pinia/Vuex Pinia/Vuex and Redux share a common goal of being the "single source of truth", where application data is stored in one or multiple stores accessible from anywhere. An example of a Pinia store: export let useProductsStore = defineStore('produc ...
While exploring the Pinia documentation, I came across a method to modify the state directly using ...mapWritableState or store.$patch(). However, I have always been taught to avoid direct state modification and instead use 'actions' in my code. ...
Hey guys, I've been working with Pinia and Vuejs 3, and I'm curious about the performance impact of using $patch(). Can anyone shed some light on this? What is considered the best practice when it comes to this situation? For instance, take a l ...