💡
原文中文，约4600字，阅读约需11分钟。
📝
内容提要
本文介绍使用 requestAnimationFrame 实现 state 变化，封装了 useAnimationFrame hook 和 <Progress /> 组件，控制进度变化更流畅。实现进度曲线变化需要推导公式。
🎯
关键要点
- 本文介绍使用requestAnimationFrame实现state变化，封装useAnimationFrame hook和<Progress />组件。
- 复习useInterval的实现，使用useInterval可以实现进度变化，但颗粒度不够细。
- 实现useAnimationFrame，使用requestAnimationFrame来控制进度变化，避免丢帧问题。
- 基于useAnimationFrame实现更多功能，如监听变化、手动控制进度等。
- 实现Progress组件，定义组件属性并控制进度前进。
- 使用useImperativeHandle暴露控制方法给父组件。
- 实现useProgress的hook，简化获取当前进度的过程。
- 总结了useState和requestAnimationFrame封装的useAnimationFrame的hook，提到三次贝塞尔曲线的复杂性。
➡️
