介绍lottie-web

Lottie是Airbnb开发的一种轻量级的JavaScript库，它能够在Web、iOS和Android平台上呈现高质量、动态的矢量动画。Lottie使得在应用中使用复杂的矢量动画变得更加容易，并且在不同平台上能够实现更高的视觉一致性。而lottie-web是Lottie的Web版本，使用它可以在Web页面中展示高品质、流畅的动态矢量动画。

 lottie-web - npm

安装：
npm i lottie-web

使用：
<template>
    <div id="animation"></div>
</template>

<script>
import lottie from 'lottie-web';
export default{
    mounted(){
        const dom = document.getElementById("animation");
        lottie.loadAnimation({
            container: document.getElementById('animation'),
            loop: true,
            autoplay: true,
            rendererSettings: {
               preserveAspectRatio: 'xMidYMid slice',
               quality: 'high',
            },
            path: 'animation.json'
        });
    }
}
</script>

<style>
#animatiion{
    width: 55%;
    height:50%;
}
</style>