vue3 pinia寫法和pinia中數據proxy對象如何獲取使用

main.ts


import pinia from '@/stores'
app.use(pinia); 引入store/index.ts中的pinia
store/index.ts
import { createPinia } from 'pinia'
import piniaPersist from 'pinia-plugin-persist'

const pinia = createPinia()
// 永久持久化插件
pinia.use(piniaPersist);
export default pinia

store/user.ts
// 使用持久化存儲

import {defineStore} from 'pinia'
import { getMenusApi } from '@/api/user'
import { toRaw } from '@vue/reactivity'
export const useUserStore=defineStore('storeUser',{
    state:()=>{
        return{
            fistName:"",
            lastName:"",
            accessToken:"",
            meunList:<any>[]
        }
    },
    getters:{
      getMeunList:(state)=>{
        return state.meunList
      }
    },
    actions:{
        setToken(value:string){
            this.accessToken=value
        },
        // 獲取菜單
        getMenus() {
          let that=this;
            return new Promise((resolve, reject) => {
              getMenusApi().then((response:any) => {
                that.meunList= [{name:""}];
                // that.meunList= JSON.parse(response) ;
                console.log("數據00000000000",toRaw(that.meunList))
                localStorage.setItem('MerMenuList', JSON.stringify(response))
                resolve(response)
              }).catch(error => {
                reject(error)
              })
            })
          },
    },
    persist:{
        enabled:true //啓用插件
    }
})
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章