请解释 Vuex 与 localStorage 在用途和机制上的不同，并说明它们各自适用的场景。
考察说明
考查对 Vuex 状态管理与浏览器本地存储各自定位、机制及适用场景的理解。
回答思路
- 【回答框架 1】Vuex 是一个专为 Vue 应用设计的状态管理模式，将组件间共享的状态集中存储并保证状态变更可预测，主要用于管理应用内部需要响应式更新的共享数据，如用户登录信息、购物车等。
- 【回答框架 2】localStorage 是浏览器提供的持久化存储接口，以键值对形式保存字符串数据，数据不会自动与组件状态同步，常用于存储需要跨会话保留的简单数据，如用户偏好、令牌等。
- 【回答框架 3】两者本质不同：Vuex 是内存中的响应式状态，刷新页面后丢失，但支持组件间响应式更新和模块化、调试工具等；localStorage 是磁盘上的持久化存储，数据不响应，需要手动读写并序列化。
- 【回答框架 4】适用场景上，Vuex 适合需要复杂状态共享和逻辑管理的应用状态；localStorage 适合存储长期保存且不要求实时同步的数据。实际开发中可结合使用，如从 localStorage 读取初始化状态，或持久化 Vuex 中的部分数据。
- 【回答框架 5】使用时要注意 Vuex 状态变更需通过 mutation 保证可追踪，localStorage 存储大小有限（约 5MB），且需处理 JSON 序列化和异常情况。
- 【关键点 1】Vuex 是响应式内存状态，localStorage 是持久化非响应式存储。
- 【关键点 2】Vuex 用于共享状态管理，localStorage 用于跨会话数据持久化。
- 【关键点 3】两者可结合，如用 Vuex 管理状态，用 localStorage 持久化。
- 【关键点 4】localStorage 存储字符串，需手动序列化；Vuex 直接使用对象。
- 【关键点 5】Vuex 适合复杂交互，localStorage 适合简单数据保存。
- 【易错点 1】不要用 localStorage 直接替代 Vuex 管理一切状态，否则会失去响应式。
- 【易错点 2】注意 localStorage 存储大小限制和 JSON 解析错误处理。
- 【易错点 3】Vuex 状态不会自动持久化，需手动同步到 localStorage。