![6034cadc193e13db5c9e97f0a5282318.png](https://i-blog.csdnimg.cn/blog_migrate/427707fa7d3fddf651452105296641d9.jpeg)
欢迎每一位爱学习的同学,小郭将用一篇文章为大家梳理Vue.js 中 vuex 知识点。请大家准备,精彩内容向下看。
Vuex 是什么?
先来看看官方解释:
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。
看完官方解释作为一个前端菜鸟还是一脸懵(),但对于vuex的应用场景,大家可能或多或少知道,用来管理一些全局数据,或者多个页面都会使用到的数据,比如,我们项目中常见的用户信息,通常使用vuex来管理。
这里,我们思考一个问题,如何没有vuex,还有哪些方式可以实现一些公共数据的管理?
- 把公共数据存储到根实例中,其他页面都可以通过 this.$root 来获取根实例中的数据。
- 把公共数据存储到根实例中,其他页面通过 provide/inject 机制来获取根实例中的数据。
以上两种方式,虽然可以用来管理我们的全局数据,但是随着项目越来越复杂,全局数据越来越多,目前这样的管理方式成本还是有些高,所以,我们需要一套系统化的,流程化的机制来管理全局数据,而vuex就是为此而诞生的。
vuex的优点:它不仅仅是一个全局数据的管理器,同时它最大的特性是支持响应式的,也就是说使用vuex管理的数据如果发生改变,那么引入这些数据的组件都会自动刷新。
vuex基本使用
第一步:安装vuex
npm
第二步:引入vuex
//main.js
由于篇幅的原因,本文暂停于此,想继续了解vuex更多的知识点,请移步到公众号“一郭鲜”,阅读完整的vuex知识梳理。
想学习更多前端知识、想获取更多前端资料欢迎关注公众号“一郭鲜”,学习前端不迷路
![73d4ff9eaab1f4e2d5aea4d2943a1719.png](https://i-blog.csdnimg.cn/blog_migrate/90c16571c70f9191f213cf3d6480db77.jpeg)