作者在Vue3项目中遇到DOMref为null的错误，发现错误发生在requestAnimationFrame的回调中。问题源于未在beforeUnmount中取消动画。解决方案是确保在组件卸载时使用cancelAnimationFrame。
打工日志：requestAnimationFrame导致的ref读取dom元素为null
今天遇到一个bug，自己写的vue3项目。当我第一次运行时完美，不会报错。但是当我修改代码后，保存。代码就会报错，都是报dom的ref为null之类的。但是页面渲染没有问题，只不过报错也会把页面卡死。
在我的逐一排查下，发现dom为null的报错都是在一个requestAnimationFrame的回调动画函数里报错的。于是我猜想应该是我没有在beforeUnmount中将requestAnimationFrame卸载。导致重新保存代码时之前的requestAnimationFrame仍然存在并且在调用保存代码前的ref，而因为代码已经保存刷新，因此之前的ref的对象就变成了null导致了报错。
因此解决办法就是在beforeUnMount中将requestAnimationFrame用cancelAnimationFrame去卸载即可，事实上也确实解决了
扫一扫
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
