How to use Vue Router in Pinia Store
2 years ago
admin
Vuejs
This tutorial will show you how to use vue-router inside a Pinia store as plugin, this way you can use the router globally.
How to use the router globally
So first of all in your Pinia store import the vue-router and markRaw from Vue, next you can add them as Plugin to the Pinia store as shown below.
import {createApp, markRaw} from 'vue';
import router from '@/routes';
import { createPinia } from 'pinia';
import App from '@/components/App.vue';
const app = createApp({});
const pinia = createPinia();
app.component('app-component', App);
pinia.use(({ store }) => {
store.router = markRaw(router)
});
app.use(router);
app.use(pinia);
app.mount("#app");