前端组件汇总

菜单

输入

轮播

图表

时间

日历

地图

音频视频

  • Vue-APlayer-：cake：用于 Vue 2.x 的易于配置的音乐播放器。
  • vue-audio-音频标签包装器；Vue 2.x 的声音播放器组件
  • vue-dplayer-基于 DPlayer 的 Vue 2.x 视频播放器组件。
  • vue-canvasvideo-一个 Vue 2.x 组件，用于在 iOS / Safari 上播放视频背景和自动播放视频。
  • vue-music-基于 html5``的 Vue 组件。
  • vue-audio-visual-Vue HTML5 音频可视化组件。
  • vue-plyr-一组用于 plyr 视频和音频播放器的 Vue 组件。
  • v-playback-一个 Vue2 插件，可简化视频播放。
  • vue-audio-recorder-Vue.js 的音频记录器。它允许在服务器上创建，播放，下载和存储记录
  • vue-video-section-Vue 的简单视频标头/部分组件。适用于视频背景并在其上叠加内容。

无限滚动

拉动刷新

降价

PDF

  • vue-pdf-基于 mozilla 的 PDF.js 的 pdf 查看器
  • pdfvuer-Vue 的 PDF 查看器，使用 Mozilla 的 PDF.js 和文本支持。演示

树

社交分享

  • vue-social-sharing-一个 Vue.js 组件，用于共享指向社交网络的链接，可与 Vue.js 1.X 或 2.X 一起使用。
  • vue-goodshare-用于社交共享的 Vue.js 组件，具有精美的按钮设计。简单的安装，丰富的文档，开发人员支持，SEO 友好，干净的代码，无需脚本即可快速跟踪页面上的用户活动。使用 Vue.js2.x。
  • vue-socialmedia-share-一个 Vue.js 组件，用于使用 Vue 2.X 共享与社交网络的链接
  • vue-picture-sharesheet-一个 Vue 图片共享表组件，受到苹果新闻编辑室中图片共享表的启发
  • vue-twitter-用于嵌入 Twitter 小部件(例如时间线，按钮)的 Vue.js 组件
  • vue-share-buttons-Vue.js 组件，用于在您的项目中放置按钮，您可以共享任何东西

＃＃ 二维码

  • vue-qriously-一个 Vue.js 2 组件，用于使用 qrious 在 HTML Canvas 上绘制 QR 代码。
  • vue-qart-vue 2.x 用于 qart.js 的指令。
  • vue-qrcode-reader-一个 Vue.js 2 组件，可从相机流中检测和解码 QR 码。

搜索

其他

标签

电话号码输入格式器

  • vue-phone-number-input-一个漂亮的输入，用于格式化与国家/地区代码有效的电话号码：fire：

选择器

  • vue-smooth-picker-Vue 2.x 的平滑选择器组件，例如 iOS 本机日期时间选择器。

发电机

  • FormSchema Native-使用 JSON Schema 和 Vue.js 生成表单
  • vue-awesome-form-一个 vue.js 组件，就像 json-editor
  • vue-generator-Vue 项目的初始路由器和组件。
  • vue-form-json-从 json 生成具有验证和 bulma 样式的 vue 表单
  • form-create-具有动态呈现，数据收集，验证和提交功能的表单生成器，支持 json 数据
  • element-form-builder-使用 JSON 模式构建 element-ui 表单。
  • ncform-一种非常好的配置生成表单的方式
  • Laraform-具有 Laravel 支持的 Vue.js 的高级表单生成器
  • vue-ele-form-Vue DataForm，基于 element-ui

日期选择器

  • vue-datepicker- [未维护]具有用于 Vue.js 的材质设计的日历和 datepicker 组件。
  • vue2-timepicker- [未维护] Vue 2.x 的下拉时间选择器(小时|分钟|秒)，具有灵活的时间格式支持。
  • vuejs-datepicker-一个简单的 Vue.js datepicker 组件。支持禁用日期，内联模式，翻译。
  • vuedt- [未维护]疯狂的轻量级(5.5kb！)Vuejs 日期和时间选择器组件，动画效果很好，而且没有太多的模糊感。
  • vue-flatpickr-component用于flatpickr日期时间选择器的 Vue.js 组件
  • vue-bootstrap-datetimepickerVue.js 组件，用于[eonasdan-bootstrap-datetimepicker](https://github.com/Eonasdan/bootstrap- datetimepicker /)
  • vue-jalaali-datepicker-vue.js 的 Jalaali 日历和日期选择器 2。
  • vue-date-picker-一个受材料设计启发的 vue 日期选择器组件
  • vue-monthly-picker-仅适用于月份和年份选择器的 Vue.js 组件
  • vue-hotel-datepicker-响应式日期范围选择器，显示选定的住宿天数，允许自定义入住/退房规则，屏蔽日期，本地化支持等。
  • vue2-persian-datepicker-vue 的真棒波斯 datepicker 组件。کامپوننتانتخابتاریخبرایویو。
  • vue-datetime-Vue 的移动友好日期时间选择器。支持日期，日期时间和时间模式，i18n 和禁用日期。
  • vue-rangedate-picker-具有简单用法的范围日期选择器
  • v2-datepicker-基于 Vue 2.x 的简单 datepicker 组件。
  • vue-datepicker-local-Vue2 的一个漂亮的 Datepicker 组件。
  • vue-airbnb-style-datepicker-Vue datepicker，外观和功能与流行的 AirBnb datepicker 相似。轻巧，可配置且良好的浏览器支持！
  • vue-persian-datetime-picker波斯材料 datepicker。支持日期时间，日期，时间，年，月。
  • VCalendar非常可定制且功能强大的日历/日期选择器组件，具有许多功能和完善的文档。
  • @ owumaro / vue-date-range-picker-使用 Bootstrap 4 样式进行日期范围选择的 Vue 组件
  • vue-datepicker-mobile-适用于 vue2 的移动友好日期选择器。：cn：选择日期或日期范围，然后自定义所需的日期。
  • vue-draggable-cal-不是普通的日期选择器。一个 Vuejs 可拖动的日期选择器，具有全新的响应式设计，可移动且具有 0 个依赖项，已压缩 17kb。
  • vue-vanilla-datetime-picker-Vue 的日期时间选择器。
  • vue2-daterange-picker-基于 bootstrap-daterangepicker 的 Vue2 日期范围选择器(无 jQuery 依赖性)
  • vue-timeselector-完全简单可定制的 Vue.js 功能强大的时间选择器组件。
  • vue-date-picker-Vue 2.x 的轻量级 datepicker 组件。
  • vue-ctk-date-time-picker-一个漂亮的 VueJS 组件，用于选择日期和时间(使用范围模式)：新：
  • simple-vue2-datetimepicker-一个简单易用的 vue.js 组件，用于日期和时间选择。：新：
  • vue-business-hours-Vue 组件，用于在管理面板或仪表板中选择营业时间。
  • material-vue-daterange-picker-Vuejs 2.x 的 Material Design 样式的日期范围选择器，与 vuetify 和友好版本兼容手机。
  • vue-datepicker-具有 Vuejs 2.x 的 Material Design 样式的干净响应式日期选择器。(日期/月/季度&&日期范围选择器)：新：

选择

  • vue-select-一个本地 Vue.js 组件，提供与 Select2 类似的功能，而无需 jQuery 的开销。
  • vue-multiselect-Vue.js 的通用选择/多重选择/标记组件。
  • stf-vue-select-最灵活和自定义的选择 Vue2
  • vue-select-image-Vue 2 组件，用于从列表中选择图像
  • @ riophae / vue-treeselect-具有对 Vue.js 的嵌套选项支持的多选组件。
  • @ k186 / pd-select-一个移动 UI 组件，例如 Vue 2.x 的 IOS 选择器，可以随便定义。
  • vue-dropdowns-如果对 vue2.x 使用对象，则是一种显示选择框的简约且可适应的方法
  • v-cascade-带有 Vue 2.x 的层叠选择器的一个可爱组件(支持 PC 和 Mobile)
  • vue-multi-select-用于对 Vue2 进行选择/多重选择的自定义组件。
  • v-region-一个简单的区域选择器，提供中文行政区划数据。
  • v-selectpage-Vue2，分页列表或表格视图的强大选择器，使用标签进行多项选择，i18n 和服务器端资源支持。
  • vue-cool-select-引导程序/材质设计主题，支持广告位，自动填充，事件，验证等。
  • @ myena / advanced-select-具有搜索功能，用于(取消)全选和 Bootstrap 3 主题的单/多选择组件
  • @ alfsnd / vue-bootstrap-select-Vue 版本的bootstrap-select。

滑块

拖放

自动完成

  • vue-instant-Vue 即时可让您轻松为 vue 2 应用程序创建带有自动建议的自定义搜索控件。
  • v-autocomplete-Vue.js 的自动填充组件
  • vue-awesomplete-Awesomplete 的 Vue 包装器
  • vue-auto-complete-Vue2 的自动完成。适用于对象或 api 调用。
  • vue-autosuggest-WAI-ARIA 完整的 Autosuggest 组件，对渲染和样式进行了完全自定义。
  • v-autosuggest-一个简单的模块化 Vuejs 组件，可以自动建议来自动态或静态数据查询的输入。
  • 自动完成-适用于 Vue.js 2. *的简单自动完成组件
  • vue-infinite-autocomplete-Vue 的 Vue 无限-自动完成包装 2。
  • vue-simple-suggest-Vue.js 的简单但功能丰富的自动完成组件
  • v-suggest-一个 Vue2 插件，用于输入内容建议，支持键盘快速选择。
  • vue-bootstrap-typeahead-使用 Bootstrap 4 CSS 的 Vue2 的 typeahead / autocomplete 组件。

类型选择

  • vue-input-tag-Vue.js 2.0 输入标签组件。
  • v-distpicker一个灵活，高度可用的区域选择器，用于为 Vue.js 2.x 挑选中国的省，市和地区。
  • vue-img-inputerVue 2 的优美，高度可定制的 img 类型输入
  • vue-img-previewvue 2 中的图像输入预览组件
  • v-image：相机：用于输入 type = file 的小组件(<1kb，已压缩)
  • @ voerro / vue-tagsinput一个简单的标签输入了带有 typeahead / autocomplete 的 Vue.js 2 组件
  • vue-tag-selector-类似于标签的输入。轻巧，可自定义并处理 REGEX 验证！

颜色选择器

开关

屏蔽输入

RTF 编辑

图像处理

视频操作

  • vue-playlist-轻量级的 vue(2.0)组件，没有依赖关系，可提供真正无缝的 html5 视频播放。使用 Vanilla JS 进行无缝视频播放的唯一且唯一可行的解 决方案。它需要一系列视频并将它们拼接在一起成为一个视频。

＃＃ 上传文件

  • vue-clip-用于 VueJ 的简单且可入侵的文件上传器。支持 Vue> = 2.1。
  • vue-simple-upload-Vue.js 的简单文件上传组件。
  • vue2-multi-uploader-使用 Vue.js v2 和 Axios 的拖放式多文件上传器组件。上载器显示文件名，大小和添加文件的总大小。它还允许设置所需的最小文件上传数量。
  • vue-dropzone-Dropzone.js 的 Vue.js(vue2)组件-具有图像预览功能的拖放文件上传实用程序。
  • vue-transmit-一个纯粹的基于 Vue 2.0 的 Dropzone.js 的 Vue.js 拖放上传器组件
  • vue-upload-component-Vue 上载组件，多文件上载，上载目录，拖动上载，拖动目录。支持 Vue> = 2.0
  • vue-uploader-一个由 simple-uploader.js 驱动的 Vue.js 上传组件
  • ic-firebase-uploader-用于 Firebase 存储的干净的多文件上传组件。
  • vuejs-uploader-用于大型文件上传的可恢复的分段文件上传器。
  • vue-filepond-FilePond 的 Vue.js 组件-文件上传库，可以上传您扔给它的任何内容。
  • v-uploader-一个 Vue2 插件，可以使上传文件变得更加轻松简单，您可以拖动文件或在对话框中选择文件进行上传

上下文菜单

其他

  • vue-gmaps-使用 Google Maps API 搜索地点和地址。
  • vuep-使用实时编辑器和预览渲染 Vue 组件的组件。
  • vue-places-Places 组件基于 Vue 2.x 的 places.js。将任何输入转换为地址自动完成。
  • vue-password-strength-meter-vue.js 中基于 zxcvbn 的密码强度计。
  • vue-float-label-Vue.js 的浮动标签模式。
  • vue-longpress-一个 VueJS(2.x)按钮组件，需要您持续按下以确认给定的动作。
  • vue-google-autocomplete-适用于 Google Maps Places API 的 Vue.js(2.x)自动建议组件。
  • vue-ip-input-Vue.js 2.x 的 ip 输入组件
  • vue-default-value-Vue.js 2.x 指令为可编辑元素设置默认值，而不会影响模型状态
  • vue-model-autoset-一个 Vue.js 插件，可解决通过 v-model 指令观察动态添加的属性时 Vue 的限制
  • vue-submit-Ladda 的简单实现([1](http://lab.hakim.se /ladda/)，2)不到 90 行代码，没有任何依赖关系。
  • vue-rate-Vue 的费率组件
  • vuetify-google-autocomplete-适用于 Google Maps Places API 的 Vuetify 就绪 Vue.js(2.x)自动建议组件。
  • vue-ripple-directive-材质纹波效果作为 Vue 指令。
  • vue-fab-Vue 浮动操作按钮。
  • vue-complexify-来自 jquery.complexify.js 的 Vuejs 移植库。
  • vue-mc-Vue.js 的模型和集合
  • vue-stars-高度可定制的等级控制(使用星号或其他字符)
  • vue-confirmation-button-可自定义的确认按钮，要求用户在执行操作之前先阅读消息
  • vue-poll-用于投票的 Vue.js 组件
  • vue-diagrams-vue.js 的图表组件，受 react-diagrams 启发
  • vue-easy-polls-一个 Vue.js 组件，用于创建民意调查，投票和显示结果。它易于实现且易于定制。
  • vue-m-button-vue 的漂亮按钮组件。
  • vue-long-click-用于 vue 的长按(长按)指令库，支持移动设备和台式机。
  • vue-ui-predicate-规则编辑器，通用过滤 UI，Vue JS 的谓词组件。
  • vue-mobile-detection-Vue.js 原型函数this。$ isMobile()会根据布尔值是否返回布尔值用户正在使用手机浏览。
  • vue-input-contenteditable-用于`contenteditable’的 Vue 组件包装，具有您通常期望的所有功能。进行漂亮的输入，不受“ input [type =’text’]”的限制。

向导

  • vue-form-wizard-基于选项卡的组件，可以代替经典的 bootstrap 和 jQuery 表单向导
  • vue-stepper-一个简单的步进器，具有诸如 next，back 和 end 之类的简单动作，可以执行简单的表单。
  • vue-stepper-component-具有 Vuex 支持和零依赖性的完全可定制的 Stepper 组件。

CSV

  • vuecsv-来自 json 的简单 CSV 下载程序，带有选项模式面板组件。

评论系统

  • vue-comment-grid-💬 使用 CSS Grid 和 Firebase REST API + Authentication 构建的自适应 Vue.js 注释系统插件。

帆布

链接预览

  • link-prevue-用于生成链接预览的灵活组件。

游览

UI 布局

  • vue-waterfall-Vue.js 的瀑布布局组件。
  • vueisotope-用于同位素过滤器和分类魔术布局的 Vue 组件。
  • vue-grid-layout-Vue.js 的可拖动和可调整大小的网格布局。
  • vue-drag-zone-Vue.js(2.x)的拖动区域组件。
  • vue-masonry-用于砌体块布局的 Vue.js 指令。
  • vue-fraction-grid-基于 Flexbox 的 Vue.js 响应式分数网格系统。
  • vue-virtual-scroll-list-Vue(2.x)组件通过使用虚拟滚动列表支持大数据。
  • vue-virtual-scroller-用于有效滚动大量元素的组件(Vue 2.x)。
  • vue-virtualscroll- [Vue 2.x]组件用于虚拟滚动内容。
  • vue-inview- [Vue 2.x]视口，在输入或离开 DOM 元素时获取通知。
  • dnd-grid-具有可拖动和可调整大小的框的 vuejs 网格
  • vue-extend-layout-扩展默认布局或为 Vue.js SPA 的页面创建自定义布局
  • vue-masonry-css-由 CSS 驱动的 Vue.js Masonry 布局组件，无依赖
  • vue-fullpage.js-Vue.js 的官方 fullPage.js 组件。
  • vue-virtual-collection-用于有效渲染大型集合数据的 Vue 组件。
  • 自动响应-vue-Vue 的自动响应网格布局库。
  • VueFlex-一个 flexbox 网格系统。
  • v-chacheli-一个 Vue.js 组件，用于创建和显示类似于仪表板的自定义网格布局。
  • vue-grid-styled-一组轻量级的功能网格组件，从 React 的grid-styled / jxnblk /网格样式/)
  • 简单网格-用于网格布局的 Vue 组件，支持 flex。
  • vue-container-component-受 Bootstrap 容器启发的简单容器组件
  • vue-colcade-用于将 Colcade 网格布局集成到 Vuejs 的小包装。
  • vue-ads-layout-一个小的 Vue 组件库，可快速生成带有工具栏，左/右抽屉和页脚的响应式 Web 应用程序布局。所有组件都可以固定或相对放置。
  • vue-magic-grid-Vue.js 2 的 Magic Grid 小端口。
  • vue-splitter-pane-一个 Vuejs 组件，它以可调节的拆分方式(垂直或水平)呈现两个插槽。
  • splitpanes-一个 Vue JS 可靠，简单且可触摸的窗格拆分器/缩放器。
  • vue-mock-layout-轻松模拟 Vue 应用程序的布局。
  • vue-simple-drawer-带有反弹动画，支持嵌套和自定义主题的小抽屉面板。方向：左/右/上/下
  • vue-grd-用于网格布局的简单，轻巧和灵活的 Vue.js 组件。

自适应

手机

  • Framework7-Vue-使用 Framework7＆Vue 构建功能齐全的 iOS 和 Android 应用。
  • vux- [中文]基于 WeUI 的 Vue UI 组件。
  • vue-onsenui-使用 HTML5 和 JavaScript 的移动应用开发框架和 SDK。创建美观，高性能的跨平台移动应用程序。基于 Web 组件，并提供 Angular 1、2，React 和 Vue.js 的绑定。
  • Weex-Weex 提供了发布跨平台的功能，因此 Web，Android 和 IOS 应用程序可以使用相同的 API 开发功能。
  • weex-eros- [中文] Eros 是基于 Weex 和 Vue 的应用程序解决方案，使您能够使用 Vue 的 API，简单快速地开发 Vue 中小型应用程序。
  • mint-ui-Vue.js 的移动 UI 元素。
  • vant-来自 YouZan 的 Vue.js 2.0 移动用户界面。
  • cube-ui-Vue.js 编写的出色的移动 ui lib 实现 2。
  • mand-mobile-基于 Vue.js 2 的移动 UI 工具包，专为金融场景而设计。

组件集合

  • vue-mdc-Vue.js 的 Material Components Web。
  • keen-ui-用 Vue 编写并受 Material Design 启发的基本 UI 组件的轻量级集合。
  • vue-admin-Vue 管理面板框架，由 Vue 2.0 和 Bulma 0.3 提供支持。
  • vuikit-具有 Vue 所有功能的 UIkit。
  • uiv由 Vue2 实现的 Bootstrap3 组件。
  • wffranco / vue-strap-使用 Vue.js 2 构建的 Bootstrap 3 组件
  • jsmod-vue-pc-适用于 vue 2.0 的高度可扩展的 Web 组件
  • guilhermewaess / SemVue-使用 Vue 2 实现的语义 UI 模块
  • office-ui-fabric-vue-Vue.js 的 Office UI Fabric 实现
  • vuestic-admin-带有自定义组件集合的 Vue Admin 仪表板。内置 Vue 2 和 Bootstrap 4
  • 语义 UI Vue-Vue 的语义 UI 集成
  • vuesax-Vue.js 的前端 vue 组件。
  • Vue 的基本 JS 2-功能齐全的 45+ Vue.js 组件，其中包括数据网格，图表，计划程序和图表组件等。
  • Banshee-一个几乎没有渲染的 Vue UI 组件和实用程序框架，没有 CSS。
  • vue-atlas-漂亮的 Vue 组件库。
  • DevExtreme Vue 组件-65+响应迅速且功能完善的 Vue UI 组件，具有可自定义的 Material Design 和 Bootstrap 兼容主题。
  • jqwidgets-70 多个具有 Material Design 主题的 Vue.js 2.0 UI 组件。
  • vue-uix-Vue.js 中用于网页实现的 UI 集合
  • vuedarkmode-Vue.js 的极简暗设计系统 🎨
  • Kendo Vue 用户界面–为业务应用程序构建的 70 多个 UI 组件，包括网格。对多种设计语言(包括材料设计和 Bootstrap)的支持完全响应。
  • Vuent-实现 Microsoft Fluent Design 的 Vue.js 组件
  • bpit / vue-专注于效果的 Vue 组件库
  • vue-tailwind-具有可自定义类的 Vue 组件可用于 TailwindCSS，但与任何框架兼容。

管理模板

服务器端渲染

  • Nuxt.js-通用的 Vue.js 框架。
  • Ream-用于构建服务器呈现的静态网站的简约框架。
  • Universal vue-Vue CLI 插件，可轻松创建通用 Vue 应用程序

静态网站生成器

  • VuePress-简约的 Vue 驱动的静态网站生成器。
  • Peco-人类的静态网站生成器。未维护
  • Sabre-一个静态网站生成器，用于使用 Vue.js 构建快速的网站。
  • Gridsome-使用 Vue.js 构建超快速，现代化的网站

其他

  • app-framework-具有 HTML 和 JavaScript 的 IOS 和 Android 应用程序-开发，构建和部署-免费和开源。
  • Myfirebase-一种已解耦的单页应用程序框架，该框架与 google firebase 高度兼容。
  • Vue-Access-Control基于 Vue.js 的前端访问控制框架 2。
  • Basys工具箱，用于构建完整的 Vue.js 应用程序
  • CabloyJS基于 KoaJS＆EggJS＆VueJS＆Framework7 的终极 NodeJS 全栈业务开发平台

事件处理

  • vue-shortkey-Vue-ShortKey-Vue.js 的插件。
  • vue-throttle-event-基于 requestAnimationFrame 的油门事件。
  • vue-waypoint-Vue 的 Waypoint 组件，这是滚动时触发功能的最简单方法。
  • vue-clickaway-可重用的 Vue.js 组件的可重用 clickaway 指令。
  • vue-scrollfire-在特定的滚动位置触发事件。
  • vue-resize-directive-Vue 指令可检测具有去污和节流能力的调整大小事件。
  • v-click-outside-Vue 指令对元素外部的点击做出反应，而不会停止事件传播。
  • vue-outside-events-Vue 2.x 指令可帮助指定元素侦听发生在自身外部的特定事件。
  • vue-selectable-Vue 1.x / 2.x 指令可通过鼠标选择项目。
  • vue-click-helper-Vue2.x 指令可处理同一元素上的 click 事件和 dblclick 事件。
  • v-hotkey-Vue 2.x 指令，用于将热键绑定到组件。
  • vue-resize-Vue 2.x 组件可检测 DOM 元素的大小调整(基于事件/无 window.onresize)
  • vue-observe-visibility-使用 Intersection Observer API 的 Vue 2.x 指令可检测元素是否可见(在视口中是否被隐藏) CSS)。
  • v-dragged-用于拖动事件检测的 Vue 2.x 指令插件。
  • vue-esc-Vue.js 指令，可在转义键盘上添加文档事件监听器。
  • vue-global-events–使用 Vue 的事件修饰符处理全局事件(如快捷方式)的组件
  • vue-edge-check–检查浏览器边缘，以防止用`vue-router’滑动边缘时奇怪地触发过渡效果
  • vue-mutation-observer–使用 MutationObserver API 观察 DOM 中变化的简单而微小的指令
  • vue-scroll-show–如果用户在滚动后到达该元素，则显示该元素
  • vue-tabevents–其他打开的标签页之间易于通信
  • vue-visibility-trigger-👀 滚动到视图时以声明方式触发方法

响应式设计

  • vue-viewports-定义您的自定义视口，并在组件中使用它们。
  • vue 响应：Vue.js(2.x)指令用于隐藏/显示具有 Bootstrap 4、3 或自定义断点的 HTML 元素。
  • vue-match-media-Vue 2.x 兼容插件，提供一致，语义化的方法来使组件具有媒体查询意识。
  • vue-media-query-mixin-Vue 2 媒体查询 mixin 可以在组件 js 和组件模板中使用。与引导程序和可视化视口兼容。如果屏幕宽度为 xs，则返回 wxS；如果屏幕宽度为 sm，则返回 wSM。
  • vue-breakpoints-Vue 2 最小组件，用于显示和隐藏基于断点的元素。受到 Airbnb 的启发。
  • vue-mq-提供一些有用的工具，以语义和移动优先的 API(Vue 2.x)快速设置响应式设计
  • VueResizeSensor-支持调整大小事件的容器。
  • vue-breakpoint-component-用于 组成 CSS 断点状态。
  • fine-mq-一个很好的 API，可以轻松地管理 JS 中的媒体查询，并且可以与 VueJS 作为插件进行一流的集成。
  • vue-response-components-使用ResizeObserver创建响应组件。
  • vue-screen-size-可以轻松，被动地访问屏幕的宽度和高度。

验证

调整大小

滚动

  • vue-chat-scroll-Vue.js 2.0 的自动滚动至底部指令。
  • vue-scrollto-添加了一个指令，该指令侦听单击事件并滚动到元素。
  • vue-next-level-scroll-一种基于组件且支持 SSR 的方法，可使用现代 Scroll Behavior API 进行平滑滚动
  • vue-scroll-sync-同步容器滚动位置的组件
  • v-scroll-lock-用于正文滚动锁定而不中断目标元素滚动的 Vue.js 指令
  • vue2-perfect-scrollbar-PerfectScrollbar 简约包装器
  • vue-scroll-to-添加了一个指令，该指令侦听单击事件并滚动到元素。
  • vue-scroll-progressbar-可自定义的组件，用于指示进度条中滚动的相对位置。
  • vue-backtotop-Vue.js 的 Back-to-top 组件，单击该组件可将页面滚动到顶部。
  • VBar-适用于 Vue.js 2x 的虚拟响应式跨浏览器滚动条组件。
  • Vuebar-使用本地滚动行为的自定义滚动条的 Vue 2 指令。轻巧，高性能，可定制且无依赖性。
  • vue-detached-scrollbar-一个简单的滚动条，可以从正在滚动的容器中分离出来。
  • vuescroll-基于 Vue.js 的滚动插件，用于统一 PC 和移动设备中的滚动。
  • vue-simplebar-Simplebar 插件的 Vue.js 包装器。
  • smooth-vuebar-平滑滚动条的 Vue 指令包装
  • vue-scrollview-一个组件，该组件利用作用域的插槽来检测 vue 组件何时进入和离开视口。
  • vue-scrollactive-根据视口中的当前部分在菜单项中添加一个活动类，单击菜单项时也会滚动到该部分。
  • vue-intersect-一个 Vue 组件，用于向 Vue 组件或 HTML 元素添加交集观察者。
  • vue-scrollmonitor-一个 Vue 插件，可在支持多种浏览器的情况下观看视口内部元素的可见性状态(使用提供/注入，因此兼容 vue@2.2 。X)
  • vue-stroll-适用于 Vue.js 2.x 的超棒 CSS3 列表滚动效果组件。
  • navscroll-js-在滚动时突出显示菜单项，并且在单击菜单项时也会滚动到某个部分。用作 vue 组件，vue 指令或与 vanilla js 一起使用。
  • vue-scrollwatch-一个轻便的插件，可检测滚动事件，在元素进入视口时自定义回调，将’scrollTo’api 暴露给特定元素。使用 vue 指令。
  • vue-check-view-一个检查元素是否在视口中的插件。快速，小型，无依赖性，实时演示。
  • vue-stickto-支持多个 DOM 节点的 vue 指令会自动粘贴到顶部
  • vue2-scrollspy-一个 scrollspy 插件和动画滚动到。
  • vue-scroll-behavior-自定义路线导航中的滚动行为。特别是哈希模式。
  • vue-scroll-stop-到达边缘时停止传播滚动。
  • vue-seamless-scroll-Vue.js 的简单无缝 滚动。

路由

延迟加载

分页

动画

  • vue2-animate-Animate.css 的 Vue.js 2.0 端口。与 Vue 的内置转换一起使用。
  • animated-vue-一个 Vue.js 2.x 插件，可轻松使用 Animate.css 动画作为过渡。就像``一样简单！
  • vue-lottie-一个 Vue.js 2.x 插件，用于基于 bodymovin 渲染特效动画
  • Vueg-使 vue-router 具有过渡效果/为 webApp 提供转场特效的开源 Vue 插件
  • v-animate-css-最容易实现 Animate.css 的 Vue 2 指令
  • vue-mixin-tween-Mixin 工厂，它将补间值添加到动画的组件上下文中
  • v-odometer-轻松平滑地转换数字。使用此库可为您的应用程序提供平滑的动画，仅适用于数字。
  • vue2-transitions✨ 可重复使用的 Vue 2 过渡组件
  • vue-overdriveVue 应用程序的超级简单的魔术移动过渡 🎩
  • animated-number-vue超级简单的数字动画方法。
  • vue-typed-js集成了 Typed.js，可轻松创建打字动画。
  • vue-parent-change-transition启用子组件在更改父组件时进行动画处理。
  • vue-smooth-reflow响应数据变化而转换元素重排。
  • VueTween允许组件补间其属性。
  • vue-slide-up-down就像 jQuery 的slideUp /slideDown一样，但是对于 Vue！
  • vue-animejsVue 的简单anime.js指令。
  • Eagle.jsEagle.js 是 Vue.js 的基于 Web 的幻灯片框架。
  • vue-posePose for Vue 是一个声明式运动系统，结合了 CSS 过渡的简单性和 CSS 的强大功能和灵活性 JavaScript。
  • vue-slide-up-down-component这是一个简单的界面，但是实现了非常灵活而强大的幻灯片动画 Vue！
  • femtoTween具有一流 Vue 支持的简约(零深度，小于 1k)补间库
  • vue-sequential-entrance插件，用于创建带有页面元素列表的优雅的连续动画入口。零努力。简单轻巧
  • vue-animate-scroll一种超级轻量级 的方法，可在元素滚动到视图中时向其添加 CSS 动画。
  • vue-svg-transition创建 2 状态，SVG 驱动的过渡
  • vue-page-transitionVue.js 的简单路由/页面转换

元标记

  • vue-head-管理 head 标签的元信息，一种简单的方法。
  • vue-meta-在 Vue 2.0 组件中管理页面元信息。支持 SSR +流媒体。
  • vue-headful-从视图中设置文档``和 meta 标签。
  • vue-simple-headful-使用 vue.js 轻松设置元标记-具有 TypeScript 支持的更简单的vue-headful替代方法。

传送门

  • vue-dom-portal-Vue.js 组件中 DOM 元素的转义口。
  • portal-vue-一个 Vue 插件，用于在 DOM 中的任何位置渲染组件的模板(在 virtualDOM 级别上有效，不会在 DOM 中移动节点)

过滤器

SVG

  • vue-svgicon-创建 svg 图标组件的工具。(版本 2.x)。
  • vue-content-loading-Vue 组件可轻松构建(或使用预设)Facebook 之类的 SVG 加载卡。
  • vue-annotator-使用任何 SVG 元素(“ rect”，“ polygon”以及其他更多元素，即使包装了 HTML 元素如“ canvas”，也可以为页面添加注释)在foreignObject中)
  • vue-svg-sprite-简单使用 SVG sprite(vue 2.x)的指令。
  • vue-svg-filler-用于自定义 svg 文件 🖍(vue 2.x)的 Vue 组件。

其他

WebGL

全屏

页面可见性

打印