前端随心记---------vuex

Posted 2021-05-07 hudunyu

为什么会出现vuex？      

        在一些大型应用中，有时我们会遇到单页面中包含着大量的组件及复杂的数据结构，而且可能各组件还会互相影响各自的状态，在这种情况下组件树中的事件流会很快变得非常复杂也使调试变得异常困难。为了解决这种情况，我们往往会引入状态管理这种设计模式，来降低这种情况下事件的复杂程度并且使调试变得可以追踪。而 Vuex 就是一个专门给为 Vue.js设计的状态管理架构。

 

vuex 概述

        Vuex 是状态管理模式的一种实现库，主要以插件的形式和 Vue.js 进行配合使用，能够使我们在 Vue.js 中管理复杂的组件事件流。通常情况下，每个组件都会拥有自己的状态，也可以理解成自身实例中的 data 对象。用户在操作的过程中，会通过一些交互行为，例如点击、输入、拖动等修改组件的状态，而此时往往需要将用户引起的状态变化通知到其他相关组件，让他们也进行对应的修改。由于 Vue.js 本身的事件流是依赖于 DOM 结构的，组件修改状态后需要经过一系列冒泡才能达到顶部的组件，而且如果需要修改兄弟组件的状态还需要共同的父组件再进行一次广播。这种方式无疑是低效而且不易维护的，我们也很难去追踪事件流的走向。

 

Vuex 的基础用法，并核心概念 Store（仓库）、State（状态）、Mutations（变更）、Actions（动作）