uniapp项目使用 vuex管理状态的基本使用

uniapp项目使用 vuex管理状态的基本使用

步骤：

1. 安装：npm i vuex@3❗vue2项目是下载版本3，vue3项目下载版本4

2. 在 src/store/modules/user.js导出状态（这里采用模块化+的方法好管理一点）

   // src/store/modules/user.js
   
   export default{
       // 命名空间
       namespaced: true,
       // state 相当于组件的 data
       state:{...},
       // getters 相当于组件的 computed
       getters: {...},
        // mutations 相当于组件的 methods，同步写法
       mutations: {...},
        // actions 相当于组件的 methods，异步写法
       actions: {...}            
   }
   

3. 在 src/store/index.js中统一注册使用

   import Vuex from 'vuex'
   import user from './modules/user'
   
   Vue.use(Vuex)
   
   const store = new Vuex.Store({
       modules:{
           user
       }
   })
   
   // 导出 store
   export default store
   

4. 挂载到 main.js中

   import store from './store'
   
   const app = new Vue({
       store,
       ...App
   })
   

Vuex在vue项目中的更具体使用可参考该文章

uniapp基础、uView引入与项目开发指引