pinia

vuex5

stores/

import { ref, computed,reactive } from 'vue'
import { defineStore } from 'pinia'
import router from '@/router'

export const useCounterStore = defineStore('counter', () => {
  const count = ref(0)
  const doubleCount = computed(() => count.value * 2)
  function increment() {
    count.value++
  }

  const login = reactive([{
    path:"/",
    name:"home",
    component:"views/HomeView.vue"
  },{
    path:"/about",
    name:"about",
    component:"views/AboutView.vue"
  }])
  function addRouter (){
    login.forEach(item=>{
      router.addRoute({path:item.path,component:() => import(`../${item.component}`)})
    })
  }
  // addRouter()
  return { count, doubleCount,login, increment,addRouter }
  
})

main.js

import { createApp } from "vue";
import { createPinia } from "pinia";
import App from "./App.vue";  
const app = createApp(App);
app.use(createPinia());
app.mount("#app");