关于公司框架的理解

Posted 2021-12-14 zhengyufeng

 前谈：

   我是一个刚刚入行不久的前端小白，最近因新进入公司工作，学习了新的架构，在这里谈一下自己对公司架构的理解。

使用vuex进行统一状态管理：  

 公司前端的框架是使用vue框架，这个就不用说了，从这些年vue的火爆程度来说，选择vue是很正确的选择。这里具体要说的是公司的架构是公司所有的数据和网络请求都是通过vuex进行的状态管理。以前我所知道的vuex的使用场景是类似购物车这样的众多页面共用一些数据的时候才使用vuex，因为好多页面都需要公用一些数据，通过兄弟组件传值的话太不方便了。现在公司所使用的架构是所有的数据和网络请求都是通过vuex进行的状态管理，这个刚开始并不是太理解，感觉太麻烦了。现在感觉这样做也是有他的好处的，虽然把所有的数据和网络请求都通过vuex进行状态管理会比较麻烦，但这样写的话多人开发的代码可读性很高，并且增强了代码后期的可维护性，所以好处还是比较多的。接下来给大家说一下vuex的一些基础概念的讲解：

Vuex的主要概念如下：

(1).Store
表示对Vuex对象的全局引用。组件通过Store来访问Vuex对象中的State
(2).State
Vuex对象的状态，即其所拥有的数据（相当于每个vue文件中的state）
(3).Getter
相当于Store的计算属性。因为就像计算属性一样，Getter 的返回值会根据它的依赖被缓存起来，且只有当它的依赖值发生了改变才会被重新计算。（就相当于计算属性）
(4).Mutation
定义了对State中数据的修改操作。组件使用State中的数据的时候并不能直接对数据进行修改操作，需要调用Mutation定义的操作来实现对数据的修改。这也是Vuex定义中所说的用相应的规则来让数据发生变化的具体实现（这个是相当于方法，有一点要注意在vuex中要改变state中的数据只能通过Mutation）
(5).Action
Mutation中定义的操作只能执行同步操作，Vuex中的异步操作在Action中进行，Action最终通过调用Mutation的操作来更新数据
(6).Module
Store和State之间的一层，便于大型项目管理，Store包含多个Module，Module包含State、Mutation和Action

 

 

这里我就说这么多，如果想了解更多的基础知识和使用可以访问下面的链接，查看vuex的官方文档：

   https://vuex.vuejs.org/zh/guide/