vuex -- 刷新浏览器数据重置

vuex -- 状态管理,重点是管理,不是存储(除了能管理数据 state,还能管理读写数据的操作 mutation ), 响应式,vueX可以简单的实现数据监听,自己写又去重复造轮子

localStorage  --  用于本地持久化数据存储,,浏览器提过的只有读写数据的功能,没有管理的功能,如果单读用的话你就需要自己写管理的功能。两者一起使用不冲突。

用vuex 共享一个数据时候可以大大减少组件之间的耦合,如果是三个组件共享数据,而又有一个很多表单交互,是否值得为双向绑定,增加额外的代码量?你不用自使用js实现类似于他的功能也是可以,只是官方开发者使用代码实现了这一功能,至于版本的选择与是否使用要看项目的架构

解决办法:

1、使用 localStorage 存储  弊端很明显,sessionStorage只能对数据进行简单的读写,在不同组件之间读写数据并做数据转化时,都需要对每个读写操作都写上一遍相同的代码。
            为了省下这重复的工作量,我把读写数据的处理写成一个全局函数,这样使用方式简单,功能也能实现。
            但是随着需求的变动,需要交互的数据越来越多,全写成全局函数,显然不适合了,需要一个单独的模块这来管理这些数据读写操作。

2、使用 keep-alive ,,如果用keep-alive,多页面共活,一个数据对象会同时在多个页面N个组件中同时展示,并有增删改查需求,还要保持状态唯一,就会体会到让vuex集中管理的好,如果强说各组件各自实现增删改查逻辑,数据更新后推送消息到各组件中一一更新,当然可以,从来没有什么技术栈是不可替代的,大都只是为了让某些需求和功能更轻松规范的实现而已

原文地址:https://www.cnblogs.com/slightFly/p/12447533.html