Events

vue3-lottie will also emit the following events as they are described in the lottie-web documentation. Look at the examples provided in the examples section for how to use these methods.

onComplete

If your animation has a finite amount of loops you can use this event to know when the animation has completed.

onLoopComplete

If your animation has a finite amount of loops you can use this event to know when the animation has completed a loop.

onLoopComplete demo

onEnterFrame

This event is fired at every frame of the animation. There will be 60 events fired per second if your lottie animation runs at 60fps.

onSegmentStart

This event is fired when the animation enters a segment.

onAnimationLoaded

This event is fired when the animation has loaded. This should let you know when you can start referencing the methods for the component.

Don't use the mounted or onMounted lifecycle hooks because they will be called before the animation has loaded in the browser. Use the onAnimationLoaded event instead.