vuex实用目录

vuex目录:

index.js--主入口文件

import Vue from "vue"
import Vuex from "vuex"
import app from "./modules/app.js"
Vue.use(Vuex)

export default new Vuex.Store({
	modules: {
		app
	}
})

modules---模块文件夹
app.js ---app模块

import { Login } from "@/api/login.js"

const state = {
    name:"lala"
}
/**
 * getters 计算属性computed
 */
const getters = {
	
}

//mutations => 修改state,类似于事件函数
const mutations = {
	SET_ISCOLLAPSE(){
        }
}

const actions = {
	
}

export default {
	//命名空间--防止命名冲突
	//调用时候-- root.$store.commit('app/SET_ISCOLLAPSE');
	namespaced: true,
	state,
	getters,
	mutations,
	actions
}

调用时候

//调用state里的属性
 root.$store.state.app.name;
//触发mutations里的方法
 root.$store.commit('app/SET_ISCOLLAPSE');

好处多多:
1、防止命名冲突
2、报错能通过路径迅速找到错误位置

posted @ 2020-04-14 09:49  麦子同学  阅读(334)  评论(0编辑  收藏  举报