I saw a good animation website today: https://lottiefiles.com/
You can edit and generate animation by yourself, and it can be easily introduced into your project.
For example, the cat animation above:
import Lottie from "react-lottie";
import * as catData from "./cat.json";
const defaultOptions = {
loop: true,
autoplay: true,
animationData: catData.default,
rendererSettings: {
preserveAspectRatio: "xMidYMid slice"
}
};
//...
<Lottie options={defaultOptions} height={120} width={120} />
Borrowing this ability, we can make the loading effect more interesting:
There are also a lot of materials in the website that can be used for free:
Those who are interested can take a look.
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。