vuex的使用
安装依赖
cnpm install --save vuex@3.6.2
1.新建文件夹store,index.js文件
import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex); //state:仓库存储数据的地方 const state = {}; //mutations:修改state的唯一手段 const mutations = {}; //actions:处理action,可以书写自己的业务逻辑,也可以处理异步 const actions = {}; //getters:理解为计算属性,用于简化仓库数据,让组件获取仓库的数据更加方便 const getters = {}; //对外暴露Store类的一个实例 export default new Vuex.Store({ state, mutations, actions, getters })
2.入口文件main.js中引入和注册store
import Vue from 'vue' import App from './App.vue' //引入路由 import router from '@/router' //引入仓库 import store from '@/store' new Vue({ render: h => h(App), //注册路由 router, //注册仓库,组件实例的身上会多一个$store属性 store }).$mount('#app')