vuex模块化如何在vue3.2中如何使用,写个例子

在Vue3.2中，使用Vuex模块化可以通过createStore函数来创建一个store实例。下面是一个简单的例子：

// store.js
import { createStore } from 'vuex'
import moduleA from './modules/moduleA'
import moduleB from './modules/moduleB'

const store = createStore({
modules: {
moduleA,
moduleB
}
})

export default store

// main.js
import { createApp } from 'vue'
import App from './App.vue'
import store from './store'

const app = createApp(App)
app.use(store)
app.mount('#app')

// modules/moduleA.js
const state = {
count:
}

const mutations = {
increment(state) {
state.count++
}
}

export default {
namespaced: true,
state,
mutations
}

// modules/moduleB.js
const state = {
message: 'Hello World!'
}

const mutations = {
updateMessage(state, message) {
state.message = message
}
}

export default {
namespaced: true,
state,
mutations
}

在上面的例子中，我们创建了一个store实例，并将两个模块moduleA和moduleB添加到了store中。每个模块都有自己的state和mutations。在main.js中，我们将store实例作为插件使用，并将其挂载到根组件上。在组件中，我们可以通过$store来访问store实例中的状态和方法。例如，我们可以在组件中使用$store.commit('moduleA/increment')来调用moduleA模块中的increment mutation。