如何详细搭建基于Vue3的Shake抖动组件库？

本文共计1046个文字，预计阅读时间需要5分钟。

目录+正文字体+CSS样式+组件逻辑+单元测试+导出打包+正文+先看看效果+其实就是一个动态效果组件，实现起来也非常简单。之所以做这样一个组件，是为了后面写Form表单的时候会用到它做一

目录

• 正文
• CSS样式
• 组件逻辑
• 单元测试
• 导出打包发布

正文

先看下效果

其实就是个抖动效果组件，实现起来也非常简单。之所以做这样一个组件是为了后面写Form表单的时候会用到它做一个规则校验，比如下面一个简单的登录页面，当点击登录会提示用户哪个信息没输入，当然这只是一个简陋的demo

接下来就开始我们的Shake组件实现

CSS样式

其实样式很简单，当你需要抖动的时候就给它添加个抖动的样式，不需要就移除这个样式即可。