组成API促进了一个更好的组件间共享代码的模式。明确的依赖关系和命名间距的设计使我们甚至可以在不同的项目之间共享代码。这就是VueUse的主要思想。
VueUse是200多个基本实用函数的集合,用于与各种API交互,如浏览器、状态、网络、动画、时间和其他。

这些实用程序的一个小样本使你能够。
- 使用剪贴板API (demo below)
- 反应时间前 (demo below)
- 观看 放弃的 或 节流
- 轻松创建虚拟列表
- 创建花式 收藏品 或 页面标题
- 追踪窗口大小 和 焦点
- 追踪视口中元素的可见性
- 创建一个可以放置文件的区域 (下面的演示)
- 使元素可以拖动
- 创建反应式的 本地存储/会话存储
以及更多
可通过附加组件进行扩展
核心包的目标是轻量级和无依赖性。使用附加组件支持与流行包的集成。这确保了API风格的一致性。
目前,一些现有的附加组件是。
更多关于VueUse附加组件的信息请点击这里。
实例
Dropzone
创建一个可以放置文件的区域。

剪贴板
反应式 剪贴板API.

外部点击实用程序
听取元素外的点击。

视差
创建一个视差效果。它使用 useDeviceOrientation和回退到 使用鼠标如果方向不被支持。

观察放弃
你过去肯定实现过的东西。一个跳脱的手表。

TimeAgo

结语
我们只触及了表面,但希望你能了解到这个库有多棒。有数以百计的实用程序可以探索(目前有274个!),而且这个数字还在不断增加。当然,如果你发现缺少什么,你可以贡献你自己的东西。
像VueUse这样的库正引领着让Vue再次变得强大的道路。它们促进了代码的可重用性,并改善了整个开发者的体验。
潜心研究这些令人敬畏的文档,传播这些信息,也许可以给作者一个赞誉(或者请他喝杯咖啡☕️)。

VueUse - 让Vue 3值得升级的库最初发表于Vue.js Developerson Medium,在那里人们通过强调和回应这个故事来继续对话。