Vuex
vuex 是实现数据集中式状态管理的插件。数据由 vex 统一管理。其它组件都去使用 vuex 中的数据。只要有其中一个组件去修改了这个
共享的数据,其它组件会同步更新。
多个组件之间依赖于同一状态。来自不同组件的行为需要变更同一状态。
环境搭建
1、vue2安装vuex3的版本,vue3安装vuex4的版本
npm i vue@3
npm i vue@4
2、创建文件夹和js文件
3、创建store对象,并暴露
// 引入vuex
import Vue from 'vue'
import Vuex from 'vuex'// 使用插件
Vue.use(Vuex)// 创建三个对象,actions、mutations、state
const actions = {}
const mutations = {}
const state = {}// 创建store对象 这个store对象是vuex插件中的老大,最核心的对象,这个对象store是用来管理actions对象、mutations对象、state对象。
export default new Vuex.Store({// 状态对象state,getters: {},// 负责更新的对象mutations,// 负责执行某个行为的对象actions,modules: {}
})
// main.js
import store from './store'
new Vue({router,//加上该配置项,vm以及所有vc对象上都会多一个属性: $storestore,render: h => h(App)
}).$mount('#app')