Pinia持久化存储简单使用以及遇到的坑

1,086 阅读1分钟

简单使用

1、安装 npm i pinia-plugin-persist --save

2、配置main.js

import { createPinia } from 'pinia'
import piniaPersist from 'pinia-plugin-persist'
app.use(createPinia().use(piniaPersist))

3、store模块中使用

放在和state同级
persist: {
  enabled: true,
  strategies: [
    { storage: sessionStorage, paths: ['menuList'] },
  ],
},

4、遇到坑 持久化失效 解决办法:再使用的函数内部声明且调用

const login = () => {
  const list = {
    account: loginInfo.username,
    password: loginInfo.password
  }
  AccountLogin(list).then(res => {
    router.replace('/index')
    util.cookies.set('token', res.token)
    const menu = useMenuStore()
    const user = useUserStore()
    menu.getMenus()
    user.setInfo(res.information)
  })
}

核心

    const menu = useMenuStore()
    const user = useUserStore()
    menu.getMenus()
    user.setInfo(res.information)