vue3中使用vuex状态管理

vue3和vue2中使用vuex 基本一样
首先是配置vuex

// store下 index.js为总文件
import {
   createStore} from 'vuex'
import actions from './actions'
import getters from './getters'
import mutations from './mutations'
import state from './state'
import infoModule from './modules/info'

// 创建 store 实例
export default createStore({
   
    actions,
    getters,
    state, 
    mutations,
    modules: {
    
        info: infoModule 
    }
})

其次是在main.js中引用

import {
    createApp } from 'vue'
import App from './App.vue'

import store from "./store/index";

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

在c.vue组件中 修改数据

import {
   useStore} from 'vuex' 
const store = useStore()
// 打开页面修改数据 
store.dispatch('方法名', 

你可能感兴趣的:(vue,javascript,vue.js,前端)