Vuex
状态管理
分为
- state 数据
- mutations 改变state的方法
- getters 相当于组件中的计算属性 起到过滤的效果
- actions 改变state的方法 相比于mutations actions内部执行异步操作 (如发送ajax请求)
- mudules 存储各个对应的模块,方便管理
1.首先在项目src目录下创建 store目录,其目录下必须有一个去全局store,来存储state、getters、mutations、actions,modules,为了代码可维护性,全局store又分相应的js文件,然后调入到store中2.store目录下对应者对应模块属于自己的状态管理,对应的模块如何调用自身的muations呢
在组件中定义namespaced:true;
//引入自己组件私有state 和 mutations
import state from './state.js'
import mutations from './mutations.js'
export default {
//添加namespaced属性
namespaced:true,
state,
mutations
}
//全局store
import {
createStore} from 'vuex'
//引入axios 发送请求
import axios from 'axios'
//引入moduleA和moduleB组件
import moduleA from './moduleA/index.js'
import moduleB from './moduleB/index'
//为了演示将全局state mutations等写到全局store文件中
export default createStore (
{
state:{
num:10,c:20,messsage:"wu"
},
mutations:{