vue3中使用lottie-web加载动画

1.安装
npm install lottie-web --save
2.引入lottie-web和JSON文件

import lottie from "lottie-web";
import LoadingJson from "@/assets/json/loading.json";

3.创建实例并开始播放

  const jsonAnimation = lottie.loadAnimation({
    container: document.querySelector("#result_loading") as Element,  //进行播放的元素
    renderer: "svg",
    loop: true,  //循环播放
    autoplay: true,  //自动播放
    animationData: LoadingJson,  //要播放的文件
  });
  jsonAnimation.play();

4.注销
jsonAnimation.destroy();

你可能感兴趣的:(vue3中使用lottie-web加载动画)