Vue.JS项目中5个经典Vuex插件


Posted in Javascript onNovember 28, 2017

使用 Vuex 来管理 Vue 的状态,有很多好的理由。其中之一就是,通过 Vuex 插件可以非常容易的扩展一些很酷的功能。Vuex 社区中的开发人员已经创建了大量的免费插件供你使用,有许多你能想象的功能,还有一些你可能没有想到的功能。

状态持久化同步标签页、窗口语言本地化管理多个加载状态缓存操作

1. 状态持久化

vuex-persistedstate 使用浏览器的本地存储( local storage )对状态( state )进行持久化。这意味着刷新页面或关闭标签页都不会删除你的数据。

一个很好的例子就是购物车:如果用户不小心关闭了一个标签,他们可以重新打开并回到之前页面的状态。

Vue.JS项目中5个经典Vuex插件

2. 同步标签页、窗口

vuex-shared-mutations 可在不同的标签页之间同步状态。它通过 mutation 将状态储存到本地存储(local storage)来实现。选项卡、窗口中的内容更新时触发储存事件,重新调用 mutation ,从而保持状态同步。

Vue.JS项目中5个经典Vuex插件

3. 语言本地化

vuex-i18n 允许你轻松地用多种语言存储内容。让你的应用切换语言时更容易。

一个很酷的功能是你可以存储带有标记的字符串,比如"Hello {name}, this is your Vue.js app."。所有的翻译版本都会在标记的地方使用相同的字符串。

Vue.JS项目中5个经典Vuex插件

4. 管理多个加载状态

vuex-loading 有助于你管理应用中的多个加载状态。这个插件适用于状态变化频繁且复杂的实时应用程序。

Vue.JS项目中5个经典Vuex插件

5. 缓存操作

vuex-cache 可以缓存 Vuex 的 action。例如,如果你从服务器检索数据,这个插件将在第一次调用该 action 时缓存结果,然后在之后的dispatch中,直接返回缓存的值。必要时清除缓存也很简单。

Vue.JS项目中5个经典Vuex插件

Javascript 相关文章推荐
一些有关检查数据的JS代码
Sep 07 Javascript
ExtJS TabPanel beforeremove beforeclose使用说明
Mar 31 Javascript
jQuery中$.each使用详解
Jan 29 Javascript
JS实现文件动态顺序载入的方法
Mar 07 Javascript
javascript实现的闭包简单实例
Jul 17 Javascript
第四章之BootStrap表单与图片
Apr 25 Javascript
在javaScript中检测数据类型的几种方式小结
Mar 04 Javascript
vue+vuex+axios+echarts画一个动态更新的中国地图的方法
Dec 19 Javascript
在vue中,v-for的索引index在html中的使用方法
Mar 06 Javascript
vue调用语音播放的方法
Sep 27 Javascript
angular异步验证防抖踩坑实录
Dec 01 Javascript
Vue替代marquee标签超出宽度文字横向滚动效果
Dec 09 Javascript
Vue实现web分页组件详解
Nov 28 #Javascript
基于vue2实现左滑删除功能
Nov 28 #Javascript
JavaScript生成简单等差数列
Nov 28 #Javascript
微信小程序用户自定义模版用法实例分析
Nov 28 #Javascript
vue2手机APP项目添加开屏广告或者闪屏广告
Nov 28 #Javascript
浅谈vue中慎用style的scoped属性
Nov 28 #Javascript
元素全屏的设置与监听实例
Nov 28 #Javascript
You might like
几个有用的php字符串过滤,转换函数代码
2012/05/01 PHP
深入解析php中的foreach函数
2013/08/31 PHP
PHP上传文件时文件过大$_FILES为空的解决方法
2013/11/26 PHP
Yii 2.0实现联表查询加搜索分页的方法示例
2017/08/02 PHP
php正确输出json数据的实例讲解
2018/08/21 PHP
PHP中str_split()函数的用法讲解
2019/04/11 PHP
jQuery取得select选择的文本与值的示例
2013/12/09 Javascript
jquery 按键盘上的enter事件
2014/05/11 Javascript
Visual Studio中js调试的方法图解
2014/06/30 Javascript
node.js中的fs.realpathSync方法使用说明
2014/12/16 Javascript
深入分析JSON编码格式提交表单数据
2015/06/25 Javascript
js实现仿qq消息的弹出窗效果
2016/01/06 Javascript
Easyui Treegrid改变默认图标的方法
2016/04/29 Javascript
IOS中safari下的select下拉菜单文字过长不换行的解决方法
2016/09/26 Javascript
easyUI实现类似搜索框关键词自动提示功能示例代码
2016/12/27 Javascript
JavaScript中undefined和null的区别
2017/05/03 Javascript
jQuery封装placeholder效果实现方法,让低版本浏览器支持该效果
2017/07/08 jQuery
es6基础学习之解构赋值
2018/12/10 Javascript
Ant Design的可编辑Tree的实现操作
2020/10/31 Javascript
跟老齐学Python之网站的结构
2014/10/24 Python
PyQt5每天必学之滑块控件QSlider
2018/04/20 Python
python获取代码运行时间的实例代码
2018/06/11 Python
解决python文件双击运行秒退的问题
2019/06/24 Python
详解Python self 参数
2019/08/30 Python
django 解决model中类写不到数据库中,数据库无此字段的问题
2020/05/20 Python
实现CSS3中的border-radius(边框圆角)示例代码
2013/07/19 HTML / CSS
CSS3标注引用的出处和来源的方法
2020/02/25 HTML / CSS
英国在线珠宝店:The Jewel Hut
2017/03/20 全球购物
酒店值班经理的工作职责范本
2014/02/18 职场文书
委托书范本
2014/04/02 职场文书
本科毕业论文致谢怎么写
2015/05/14 职场文书
公司开业主持词
2015/07/02 职场文书
2016五四青年节活动总结范文
2016/04/06 职场文书
《工作是最好的修行》读后感3篇
2019/12/13 职场文书
如何使用JavaScript策略模式校验表单
2021/04/29 Javascript
Redis 哨兵机制及配置实现
2022/03/25 Redis