vue开发常用第三方组件

悟空和大王
1,548 阅读4分钟

将网页url生成二维码

前端QRCode.js生成二维码插件 - 掘金 (juejin.cn)

Vue3如何更好地使用qrcodejs生成二维码并添加文字描述 - 掘金 (juejin.cn)

截图将html生成图片

dom-to-image截图将html生成图片 - 简书 (jianshu.com)

dom-to-image截图将html生成图片 - 掘金 (juejin.cn)

水印

文档：

js-watermarker - npm (npmjs.com)

watermark-dom: watermark.js

打印预览时要勾选更多设置中的背景图形否则会显示一片空白

重置浏览器样式

官网： Normalize.css: Make browsers render all elements more consistently. (necolas.github.io)

normalize.css - npm (npmjs.com)

表格插件

官网：vxe-table v4 (gitee.io)

随页面滚动，而让元素随着页面滚动逐渐显示或隐藏

官网：wow.js — Reveal Animations When Scrolling (wowjs.uk)

其他文档：

焦点图/轮播图/tab实现插件

中文官网：Swiper中文网-轮播图幻灯片js插件,H5页面前端开发

vue 标签页插件

官网：Vue Router Tab (gitee.io)

其他文档：

数字运算

官网：big.js - npm (npmjs.com)

其他文档：

数字格式化显示

官网：Numeral.js (numeraljs.com)

其他文档：

日期处理

中文文档：Day.js中文网 (fenxianglu.cn)

HTML打印

官方文档：Print.js - Javascript library for HTML elements, PDF and image files printing. (crabbly.com)

其他文档：

富文本编辑器

官网：Examples & demos | Docs | TinyMCE

中文文档：上传图片和文件 | TinyMCE中文文档中文手册 (ax-z.cn)

其他文档

P.S. tinymce-vue是tinymce官方提供的一个vue组件，可以直接拿过来使用，但是必须要到官网注册获取api-key，否则只有一段时间的试用期。所以你不想购买的话就老老实实编写自己的组件. 实现方式可参考官网

GitHub - tinymce/tinymce-vue: Official TinyMCE Vue component

pdf预览

官网文档：Examples (mozilla.github.io)

其他文档：

虚拟滚动

官方文档：vue-virtual-scroll-list (tangbc.github.io)

其他文档：

气泡弹层组件

官方文档：Floating UI - Create tooltips, popovers, dropdowns, and more (floating-ui.com)

css动效组件

官网：Animate.css | A cross-browser library of CSS animations.

其他文档：

vue图片懒加载

官网：vue-lazyload - npm (npmjs.com)

其他文档：

图表组件

官网：Apache ECharts

其他文档：

HTML5视频播放

官网：MuiPlayer

vue拖拽组件

官方示例：vuedraggable (sortablejs.github.io)

中文文档：vue.draggable中文文档 - itxst.com

代码仓库：GitHub - SortableJS/Vue.Draggable: Vue drag-and-drop component based on Sortable.js

avatar
文章
阅读
粉丝