react-lottie：动画不会显示

编程问答 2022-06-07

问题描述

使用react-lottie版本1.2.3尝试在React Web应用程序中进行动画处理。

它已成功编译，没有任何错误消息，但动画无法从json文件中显示。

我遵循了React Lottie not showing animation not showing (web)，建议将animationData: animationData替换为animationData: animationData.default。都尝试过，但是没有用。

有什么想法吗？

import React,{Component} from 'react';
import Lottie from 'react-lottie';
import animationData from './lottie/lottie_page_not_found.json';

class PageNotFound extends Component {
  render(){
    const defaultOptions = {
      loop: true,autoplay: true,animationData: animationData.default,rendererSettings: {
        preserveAspectRatio: "xMidYMid slice"
      }
    };

    return(
      <div>
         <h1 style={{display: 'flex',justifyContent: 'center'}}>Page Not Found</h1>
          <Lottie
            options={defaultOptions}
            height={400}
            width={400}
          />
       </div>
    );
  }
}

export default PageNotFound;

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

lottielottiereactjsreactjsreactjsreactjs