翻牌效果时钟的演示，包含原生JavaScript、Vue、React三种实现方式。
包含 5 套代码：
- 原生Javascript
- React18/19 (javascript)
- React18/19 (typescript)
- Vue3 (javascript)
- Vue3 (typescript)
📚📚 本项目有详细的讲解教程，原文请关注我的微信公众号【卧梅又闻花】📚📚
初版教程（原理讲解看这个教程）：
《干货满满!如何优雅简洁地实现时钟翻牌器(支持JS/Vue/React》
2025年春季翻新版教程（原理不变，仅更新了React和Vue代码）：
《2025新春版：干货满满!如何优雅简洁地实现时钟翻牌器(支持JS/Vue/React》
1 翻牌的构建
• 1.1 基本结构
• 1.2 构建纸牌并用伪元素拆分上下两部分
• 知识点1：伪元素的使用
• 1.3 为纸牌添加文字
• 知识点2：line-height: 0的妙用
• 1.4 设置纸牌的层叠关系
• 知识点3：transform-origin和perspective
2 翻牌动画的实现
• 2.1 CSS3翻牌动画
• 知识点4：backface-visibility
• 2.2 JS实现翻牌交互
3 翻牌时钟的实现
• 3.1 HTML构建
• 3.2 构建Flipper类
• 3.3 实现时钟业务逻辑
• 知识点5：时间格式化函数的实现
• 3.4 运行时钟
4 Vue & React封装
• 项目Git源码