Vuex部分
(一)Vuex作用:存储组件共享的数据
1.集中管理共享数据,易于开发和后期维护
2.能够高效实现组件之间的数据共享,提高开发效率
3.存储的数据是响应式的,能够保持数据与页面的同步
(一)Vuex核心概念
1.State
访问:
(1)store.js中操作
import { createStore } from "vuex";
export default createStore({
//声明state: { }
getters,
modules,
});
(2)组件访问:
方法1:this.$store.state.属性名(template里面this省略)
方法2:组件中 import {mapState} from 'vuex' 将当前组件需要的全局数据映射为当前组件的computed计算属性:
computed: {
...mapState(["属性名"])//...是展开运算符
}
2.Mutation: 变更Store里面的数据
(1)好处:可以集中监控数据变化
(2)定义:
import { cr