我应该在卸载时明确停止 React Native 动画吗?
Should I explicitly stop React Native animations on unmount?
假设我正在使用 Animated.timing().start()
开始动画,具体时间(在挂载上或在某些外部事件上)并不重要。然后我使用 Animated.View
来渲染动画。
假设在组件卸载之前它没有完成。
我应该在卸载时显式调用动画(实际上,所有可能仍然是 运行 的动画),还是隐式地清除它?大多数手动分配的资源不会隐式释放(除非它们附加到组件,如挂钩),但动画似乎会。
好问题。我的拙见是 - no。正如您可能读到的那样 react-native docs,没有提及您应该这样做以及何时应该这样做。
如文档中所述:
Animations are started by calling start() on your animation. start()
takes a completion callback that will be called when the animation is
done. If the animation finished running normally, the completion
callback will be invoked with {finished: true}. If the animation is
done because stop() was called on it before it could finish (e.g.
because it was interrupted by a gesture or another animation), then it
will receive {finished: false}.
据此,我会说当组件被卸载时,动画被中断。就个人而言,我没有在我的应用程序中使用 stop()
并且从未因此遇到过内存泄漏。如果您尝试在 start()
回调函数中更改组件状态,可能会出现问题。这就是回调函数的 finished
属性 派上用场的地方。额外参考 .
我没有找到任何关于此的文档,但我查看了我们使用的版本 (0.59.8) 的代码。
简短的回答是没有,不需要显式停止动画,它由 React Native 管理。
长答案遵循我下面的代码分析。
当您为某个值启动动画时,该动画将绑定到 Animated.Value
。 (作为 _animation
,或作为 _tracking
。)
当您在 Animated.Component
上使用 Animated.Value
时,该值作为 _propsAnimated
.
[=39= 附加到组件]
在 componentWillUnmount _propsAnimated
上 __detach
ed,__detach
在 Animated.Value
上通过调用 Animated.Value.prototype.stopAnimation
停止动画(这是 Animated.Value) 的 public 函数。
假设我正在使用 Animated.timing().start()
开始动画,具体时间(在挂载上或在某些外部事件上)并不重要。然后我使用 Animated.View
来渲染动画。
假设在组件卸载之前它没有完成。
我应该在卸载时显式调用动画(实际上,所有可能仍然是 运行 的动画),还是隐式地清除它?大多数手动分配的资源不会隐式释放(除非它们附加到组件,如挂钩),但动画似乎会。
好问题。我的拙见是 - no。正如您可能读到的那样 react-native docs,没有提及您应该这样做以及何时应该这样做。 如文档中所述:
Animations are started by calling start() on your animation. start() takes a completion callback that will be called when the animation is done. If the animation finished running normally, the completion callback will be invoked with {finished: true}. If the animation is done because stop() was called on it before it could finish (e.g. because it was interrupted by a gesture or another animation), then it will receive {finished: false}.
据此,我会说当组件被卸载时,动画被中断。就个人而言,我没有在我的应用程序中使用 stop()
并且从未因此遇到过内存泄漏。如果您尝试在 start()
回调函数中更改组件状态,可能会出现问题。这就是回调函数的 finished
属性 派上用场的地方。额外参考
我没有找到任何关于此的文档,但我查看了我们使用的版本 (0.59.8) 的代码。
简短的回答是没有,不需要显式停止动画,它由 React Native 管理。
长答案遵循我下面的代码分析。
当您为某个值启动动画时,该动画将绑定到
Animated.Value
。 (作为_animation
,或作为_tracking
。)当您在
[=39= 附加到组件]Animated.Component
上使用Animated.Value
时,该值作为_propsAnimated
.在 componentWillUnmount
_propsAnimated
上__detach
ed,__detach
在Animated.Value
上通过调用Animated.Value.prototype.stopAnimation
停止动画(这是 Animated.Value) 的 public 函数。