前端复杂炫酷动画，哎，我就不用css写，哎，就用Lottie玩儿

去年今日有闻Lottie，对于前端来说使用起来非常简单，json文件导一导再定个位，你想在哪炫酷我就在哪炫酷。

今时今日来上手一个栗子🌰

动画原理

通过把每一帧（瞬间）的静止图像组合起来，以一定频率（速率）播放这些图像形成动画。

如何实现

这得考验设计师了。

用AE（Adobe After Effects）制作动画，结合bodymovin插件把动画导出json文件，网上很多导出案列，这里不再展开。然后加载lottie库和下面几行代码就可以实现一个lottie动画。

import React from "react";
import Lottie from "lottie-react-web";
import animation from "./demo.json"