What are some advanced features of Pinia in Vue 3?

What are some advanced features of Pinia in Vue 3?

Pinia offers several advanced features like plugins, state persistence, and modular stores. Would you like to explore any specific feature?

Can you explain how state persistence works in Pinia?

State persistence in Pinia allows you to save the store's state to local storage or session storage, so it can be restored on page reloads. You can achieve this by using the persistedstate plugin.

How do I set up a plugin in Pinia?

To set up a plugin in Pinia, you can create a function that takes the store as an argument and then use the usePinia function to register it. Would you like a code example?

Yes, please provide a code example for a Pinia plugin.

Sure! Here's a simple example:

import { defineStore } from 'pinia';

const useMyStore = defineStore('myStore', {
  state: () => ({ count: 0 }),
  actions: {
    increment() {
      this.count++;
    }
  }
});

export function myPlugin(store) {
  store.$onAction(({ name, args }) => {
    console.log(`Action ${name} was called with args:`, args);
  });
}

export default useMyStore;