Vue.js最常用的第三方插件

1. vue.js devtools

用于开发调试Vue.js的一个必备插件。可以在Chrome中的扩展程序中直接安装,也可以本地文件的方式安装。

Vue.js最常用的第三方插件

2. nprogress页面顶部进度条

当路由切换事会在浏览器的顶部出现一个蓝色进度条用于表示路由切换的进度,并在又上角有个蓝色loading的动画。

一般情况下切换到目标路由时,在目标路由中的生命周期中可能会做一些处理(如请求接口等),这些操作会有一定的耗时,所以使用进度条来表示路由切换的进度。

CSDN在切换路由时会有这种效果。只不过CSDN的进度条是红色的,右上角没有加载。

GitHub:https://github.com/rstacruz/nprogress

1.安装

2.在main.js中引入

3. HelloWorld.vue

足球

Vue.js最常用的第三方插件

3. echarts

在vue中集成echarts可以通过两种方式集成:

  • 埃查特
  • Vue-Echarts
  • 注意:echarts和vue-echarts不要同时使用。

官方示例:https://echarts.baidu.com/examples/

1安装echarts依赖

HelloWorld.vue

Vue.js最常用的第三方插件

4. vue-lazyload图片懒加载

插件地址:https://github.com/hilongjw/vue-lazyload

演示:http://hilongjw.github.io/vue-lazyload/

2.1安装和使用插件

src / main.js导入导入并使用插件

2.2需要懒加载的图片绑定v-bind:src修改为v-lazy

Vue.js最常用的第三方插件

5.导出excel

1.安装组件文件保存器,xlsx,xlsx样式,脚本加载器

2.在src下创建供应商文件夹,并创建Blob.js和Export2Excel.js两个文件

Blob.js文件地址:https://github.com/eligrey/Blob.js

Export2Excel.js文件内容请从这里获取https://blog.csdn.net/vbirdbest/article/details/86527886

Vue.js最常用的第三方插件

3.在webpack.base.conf.js中配置别名

在alias中增加vendor别名

Vue.js最常用的第三方插件

4.在组件中使用

Vue.js最常用的第三方插件
Vue.js最常用的第三方插件

注意:

  • 可以通过xlsx-style来指定单元格的样式,例如居中,单元格颜色等
  • 可以通过merges属性来合并单元格,合并单元格时需要将数据平铺开来

6.引入excel

引入只需要安装xlsx插件

Vue.js最常用的第三方插件
Vue.js最常用的第三方插件

7. moment.js

moment.js日期处理类库。中文网站:http://momentjs.cn/

安装

在使用的组件中引入

Vue.js最常用的第三方插件

注意:moment.js中的日期格式化与其他语言如(Java)中的格式不太一样。

未经允许不得转载:一点博客-青梅煮码-共享博客 » Vue.js最常用的第三方插件
分享到:
赞(0) 打赏

评论抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏