Lottie 动画

加载 Lottie 动画数据，并通过 action 控制播放状态。

支持平台

以下为官网文档所列的平台支持情况，具体功能及版本限制请参见本页的平台说明。

App-vue	App-nvue	微信小程序	支付宝小程序	百度小程序	抖音小程序	QQ小程序	H5	PC	快手小程序	钉钉小程序
✓	×	✓	✓	×	✓	×	✓	✓	×	✓

基础用法

<!-- 使用页面中的 Lottie 动画数据 -->
<fui-lottie :options="animationOptions" action="play" />

在页面声明 animationOptions，设置动画数据或路径，例如 { path: '/static/animation.json', loop: true, autoplay: true }；实际路径和平台加载方式应与项目资源配置一致。

属性

属性	类型	说明	官网默认值
width	Number / String	动画宽度，单位 rpx	600
height	Number / String	动画高度，单位 rpx	400
options	Object	动画数据和播放选项	{}
action	String	播放操作：play、pause、stop	play

本地源码支持 options.path、options.animationData、options.autoplay 和 options.loop，其中本地动画数据优先于路径，自动播放和循环默认均为 true。本地源码额外识别 destroy 操作；官网公开取值为 play、pause、stop。

平台说明

源码分别使用 App-vue/H5 的 renderjs 和小程序画布实现，使用前应在目标平台验证动画资源路径。组件未声明自定义事件。

事件

事件	说明	回调参数
—	无自定义事件	—

插槽

插槽	说明
—	官网未列出该组件的插槽