一、注意事项
1.前置条件
安装Vuex之前需要先安装vuecli脚手架和node环境,也可以直接用HbuilderX打开一个vue项目,这样就环境和脚手架就都有了
2.版本依赖
vue2的项目使用vuex3,vue3的项目使用vuex4
二、安装
接下来都以vue2的项目为例
1.安装vuex
@后面指定版本号
npm i vuex@3
2.创建 store/index.js 文件

import Vuex from 'vuex'
import Vue from 'vue'
Vue.use(Vuex)
// 响应组建中的动作
const actions = {}
// 操作数据
const mutations = {}
// 存储数据
const state = {}
// 创建并暴露store
export default new Vuex.Store({
actions,
mutations,
state
})
3.main.js 中引入 store/index.js
import Vue from 'vue'
import App from './App.vue'
Vue.config.productionTip = false
// 引入 Vuex 插件 -------------------------
import store from './store'
// ---------------------------------------
new Vue({
render: h => h(App),
// 挂载 Vuex ---
store,
// ------------
}).$mount('#app')
本文详细介绍了如何在Vue2项目中安装和配置Vuex,包括设置前置条件、版本依赖,以及从创建store文件到main.js中引入store的步骤。重点在于实战指导,适合初学者入门。
9822





