vuex 是 uni-app 中大型项目避免状态混乱的底线方案,需在 main.js 注册 store,state 修改必须通过 mutations,异步操作走 actions,跨页面注意初始化时机,并手动衔接持久化。

uni-app 项目里直接用 globalData 或 uni.setStorageSync 做全局状态共享,短期能跑通,但一上多页面联动、异步授权、跨端一致性,立刻暴露问题:状态不同步、调试无迹可循、类型不可靠。Vuex 是 uni-app 官方内置且真正可控的全局状态方案,不是“可选”,而是中大型项目里避免状态混乱的底线。
uni-app 中 Vuex 不需要 npm install
uni-app 内置了 Vuex,版本与 Vue 运行时匹配,直接 import 即可。如果你在 store/index.js 里写 import Vuex from 'vuex' 报错,大概率是路径没配对或文件没被正确引入——检查是否在 main.js 中通过 Vue.use(Vuex) 注册过 store 实例。
- 不装包:删掉
npm install vuex --save这类命令,它对 uni-app 无效甚至冲突 - 入口固定:必须在
main.js中创建并挂载 store,否则组件里this.$store为 undefined - 模块拆分建议放
store/modules/下,避免index.js膨胀成千行巨文件
state 修改必须走 mutations,不能直接赋值
这是最容易踩的坑:看到 this.$store.state.count 是个数字,顺手写 this.$store.state.count = 5,结果视图不更新、devtools 无记录、后续逻辑全错。Vuex 的响应式依赖于 mutation 的显式提交,绕过它等于关闭响应链。

