一、背景
近期在做的一个项目中遇到一个问题,场景是父模块需要一个接口的数据,其他子模块也是需要这个接口的数据,用到了vuex解决接口多次调用的问题,但是在子页面刷新,state中的数据就会丢失。后来学习了Vuex的插件,于是想到了可以用vuex的插件plugins解决这一问题。
二、plugins简介
Vuex的store接受plugins选项,这个选项暴露出每次mutation的钩子。Vuex插件就是一个函数,它接收store作为唯一参数。
三、应用示例
代码逻辑:每次 mutation 之后更新store中的state数据,并将state数据存储在localStorage中。当子页面刷新state中数据丢失时,就从本地存储重新获取值。