搭建vuex开发环境

几个要点

• npm install --save vuex@3，安装vuex插件。
  注意！！vue和vuex的搭配：vue2搭配vuex3；vue3搭配vuex4。
• src下新建文件夹：store，store下新建文件：index.js。
  • import Vuex from "vuex"，引入vuex插件。
  • Vue.use(Vuex)，应用vuex插件。
  • 创建store并导出store。

  const actions = {};
  const mutations = {};
  const state = {};
  
  export default new Vuex.store({
  	actions,
  	mutations,
  	state
  })
  

• main.js中引入并注册store

import store from "./store";
new Vue({
	store:store
})

完整代码

代码主要在以下两个文件里，

1. store/index.js
2. main.js

store/index.js

import Vue from "vue";
import Vuex from "vuex";

Vue.use(Vuex);

const state = {};
const getters = {};
const actions = {};
const mutations = {};


export default new Vuex.Store({
    state,
    getters,
    actions,
    mutations
})

actions，用于响应组件中的动作。
mutations，用于操作数据。
state，用于存储数据。

main.js

import Vue from 'vue'
import App from './App.vue'
import store from "./store";

Vue.config.productionTip = false

new Vue({
  render: h => h(App),
  store
}).$mount('#app')