安装lottie
npm install lottie-web
代码
<template>
<div id="app">
<div id="lottie"></div>
</div>
</template>
<script>
import lottie from "lottie-web";
import animationJsonData from "./01.json"; // json 文件
export default {
name: "App",
components: {
},
mounted() {
const lot = lottie.loadAnimation({
container: document.getElementById("lottie"),
renderer: "svg",
loop: true,
autoplay: false,
animationData: animationJsonData,
});
// 开始播放动画
lot.play();
},
};
</script>
<style>
#lottie{
width: 300px;
height: 300px;
}
</style>
效果