pinia persist

Pinia Persist is a plugin for the Pinia state management library in Vue.js. With Pinia Persist, you can easily persist your Pinia store's state to the browser's local storage or session storage. This means that even if the user refreshes the page or navigates away and comes back, the store's state will be automatically restored.

To use Pinia Persist, you need to install it from npm:

npm install pinia-persist

Then, you can import and use it in your Pinia store:

import { defineStore } from 'pinia';
import { createPersist } from 'pinia-persist';

const persist = createPersist({
  key: 'my-store', // the key used to store the state in storage
  storage: localStorage, // the storage object (localStorage, sessionStorage, etc.)
});

export const useMyStore = defineStore('myStore', {
  // store options
  state: () => ({
    // ...
  }),
  actions: {
    // ...
  },
}).persist(persist); // apply the persist plugin to the store

export default useMyStore;

This is just a basic example. You can find more advanced usage and configuration options in the Pinia Persist documentation.