vuex是什么?官方是这么定义的
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。Vuex 也集成到 Vue 的官方调试工具 devtools extension,提供了诸如零配置的 time-travel 调试、状态快照导入导出等高级调试功能。
个人理解就是vuex是vue的一个小型状态管理仓库,可以跨页面操作其他页面的数据状态。
基于vue-cli
安装
下载vuex,npm install vuex --sava。这里为什么要加save因为vuex不光在开发使用在生产环境也需要使用。
新建文件夹vuex,在vuex下面创建store.js文件,写入代码
引入
其他页面拿到vuex里面的数据
这里注意的是引入vuex的时候必须加一个{},不然会报错。
其他页面修改vuex的数据
vuex持久化
思路
vuex也是js,所以在客户端,页面刷新后数据就丢失了,有时候我们希望数据一直都在,这样我们就需要用到常用的常用的存储工具localStory,思路就是每次数据发生改变的时候就存入一下localStory,然后初始化的时候读取一下localStory就可以了。
实现
这里只是简单的介绍了一下vuex的使用,如果想深入学习可以点击Introduction · Vuex官方文档学习。