解决vuex持久化的插件 vuex-persistedstate

最新推荐文章于 2025-03-21 11:11:30 发布

李大帅哥

最新推荐文章于 2025-03-21 11:11:30 发布

阅读量526

点赞数

CC 4.0 BY-SA版权

分类专栏：第三方包工具文章标签： vue.js

本文链接：https://blog.youkuaiyun.com/weixin_57596274/article/details/123765510

第三方包工具专栏收录该内容

3 篇文章

订阅专栏

本文介绍如何使用vuex-persistedstate插件实现Vuex中的状态数据持久化存储到localStorage，通过具体步骤和代码示例展示如何安装配置该插件，并指定需要持久化的状态数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

//了解vuex的plugin配置项，学习vuex-persistedstate插件，让在vuex中管理的状态数据同时存储在本地（localStorage）

//安装vuex-persistedstate包
//npm i vuex-persistedstate

//在store/index.js中使用插件，来做持久化

import createPersistedstate from 'vuex-persistedstate'
//每个插件的详情应该去官网查看
export default {
    mutations:{},
    actions:{}
    plugins: [
        createPersistedstate({
          key: 'erabbit-client-pc-store',//vuex中的键名
          paths: ['user', 'cart']//要保存的数据
        })
      ]
}

key:随意起名字 paths:['要保存数据的模块名']