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 相关文章推荐
JavaScript将Table导出到Excel实现思路及代码
Mar 13 Javascript
js图片自动切换效果处理代码
May 07 Javascript
全面解析Bootstrap表单使用方法(表单样式)
Nov 24 Javascript
详解Jquery EasyUI tree 的异步加载(遍历指定文件夹,根据文件夹内的文件生成tree)
Feb 11 Javascript
javascript实现的图片预览功能
Mar 25 Javascript
vue实现的上传图片到数据库并显示到页面功能示例
Mar 17 Javascript
深入了解javascript 数组的sort方法
Jun 01 Javascript
vue translate peoject实现在线翻译功能【新手必看】
Jun 07 Javascript
用VueJS写一个Chrome浏览器插件的实现方法
Feb 27 Javascript
ES6入门教程之Array.from()方法
Mar 23 Javascript
使用vue实现HTML页面生成图片的方法
Mar 12 Javascript
JS实现长图上下滚动效果
Mar 19 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使用递归函数实现数字累加的方法
2015/03/16 PHP
两种常用的javascript数组去重方法思路及代码
2013/03/26 Javascript
javascript模拟枚举的简单实例
2014/03/06 Javascript
JavaScript去除数组里重复值的方法
2015/07/13 Javascript
基于jQuery实现响应式圆形图片轮播特效
2015/11/25 Javascript
jQuery获取某天的农历日期并判断是否除夕或新年的方法
2016/03/01 Javascript
BootStrap创建响应式导航条实例代码
2016/05/31 Javascript
ES6关于Promise的用法详解
2018/05/07 Javascript
Vue通过ref父子组件拿值方法
2018/09/12 Javascript
老生常谈JavaScript获取CSS样式的方法(兼容各浏览器)
2018/09/19 Javascript
深入理解Node内建模块和对象
2019/03/12 Javascript
详解JavaScript栈内存与堆内存
2019/04/04 Javascript
vue实现新闻展示页的步骤详解
2019/04/11 Javascript
[01:00:53]2018DOTA2亚洲邀请赛3月29日 小组赛B组 iG VS Secret
2018/03/30 DOTA
使用paramiko远程执行命令、下发文件的实例
2017/10/01 Python
基于python中theano库的线性回归
2018/08/31 Python
Python类装饰器实现方法详解
2018/12/21 Python
如何通过Python实现标签云算法
2019/07/02 Python
使用Python paramiko模块利用多线程实现ssh并发执行操作
2019/12/05 Python
使用pytorch搭建AlexNet操作(微调预训练模型及手动搭建)
2020/01/18 Python
纯css3显示隐藏一个div特效的具体实现
2014/02/10 HTML / CSS
简单掌握CSS3中resize属性的用法
2016/04/01 HTML / CSS
俄罗斯韩国化妆品网上商店:Cosmasi.ru
2019/10/31 全球购物
西班牙鞋子和箱包在线销售网站:zapatos.es
2020/02/17 全球购物
怎样声明子类
2013/07/02 面试题
C#笔试题和英文面试题
2013/02/07 面试题
七年级生物教学反思
2014/01/30 职场文书
五型班组建设方案
2014/02/10 职场文书
校园安全教育广播稿
2014/02/17 职场文书
中队活动总结
2014/08/27 职场文书
私人委托书格式
2014/09/10 职场文书
领导干部学习“三严三实”思想汇报
2014/09/15 职场文书
党委班子纠正“四风”问题整改措施
2014/10/28 职场文书
学校证明范文
2015/06/24 职场文书
python通过新建环境安装tfx的问题
2022/05/20 Python
mysql序号rownum行号实现方式
2022/12/24 MySQL