当前位置：首页 > article >正文

VUE3 pinia的对象莫名其妙被赋值成其他对象

article 2025/2/5 16:28:13

我写项目时发现，我明明把这个属性赋值成数组了，但是一启动项目，他就变成了对象了，还是个请求失败的返回对象，很是莫名其妙

后来一步一步的删除代码，看看是哪里影响到了，直到我删除了pinia的持久化配置那段代码，嘿，好使了，变成数组了

后来发现，我之前把这个属性赋值成对象了，然后给持久化存储了，这导致我一启动项目，就会读取本地存储，然后赋值给这个属性，覆盖了原来的数组，解决办法就是清理缓存，

很好，找到问题了！状态管理配置使用了 localStorage 来持久化状态，并且启用了 persist 功能。这种情况下，应用的数据会被保存在本地存储中，可能导致某些信息或请求被缓存，或者在浏览器刷新后被重新加载。

启用 localStorage 持久化：
- 在配置中指定了 localStorage，意味着状态会在浏览器关闭后继续保留。可以确认这个存储是否正是你想要持久化的，并且在调试时是否有未正确清理的旧数据。
调试本地存储：
- 打开浏览器的开发者工具，切换到 "Application" 标签页（在 Chrome 中），然后查看 "Local Storage" 部分，确认是否有键值对和存储的数据符合预期。
- 确保 key: "site" 对应的数据已经正确存储和读取。
清理存储内容：
- 如果你希望重置状态并清除本地存储，可以通过开发者工具清除 localStorage 中的数据，或在代码中显式清空：
  js复制代码
  localStorage.removeItem('site');
调试持久化策略：
- 如果是因为某些持久化数据导致的问题，你可以暂时禁用这个持久化策略，看看是否能解决问题。
- 临时禁用配置：
  js复制代码
  persist: { enabled: false, strategies: [] }
检查状态更新机制：
- 确保状态的更新与本地存储之间是同步的。比如，在改变某个状态后，确保 localStorage 中的数据被及时更新。