React Lottie 不显示动画不显示（网络）答案

【问题标题】：React Lottie not showing animation not showing (web)React Lottie 不显示动画不显示（网络）
【发布时间】：2020-09-08 19:05:38
【问题描述】：

我正在尝试一个简单的 react-lottie 示例。我没有收到任何错误，但动画没有显示。

我尝试了另一个教程，它以稍微不同的方式完成了它，但结果相同 - 没有错误，也没有动画。

我已尝试从 Lottie Files 网站为其他人切换 json 文件，但无济于事。

我不知道如何解决这个问题，因为我不知道从哪里开始调试。

有什么想法吗？

非常感谢

import React, { Component } from 'react'
import Lottie from 'react-lottie'
import * as animationData from './globe.json'

class UncontrolledLottie extends Component {


    render(){

        const defaultOptions = {
            loop: true,
            autoplay: true,
            animationData: animationData,
            rendererSettings: {
                preserveAspectRatio: 'xMidYMid slice'
            }
        };

        return(
            <div>
                <h1>Lottie</h1>
                <p>Base animation free from external manipulation</p>
                <Lottie options={defaultOptions}
                        height={400}
                        width={400}
                />
            </div>
        )
    }
}

export default UncontrolledLottie

【问题讨论】：

标签： javascript html reactjs lottie

【解决方案1】：

尝试不使用 * as 导入，例如：

import animationData from './globe.json'

【讨论】：

【解决方案2】：

因此需要将animationData 换成animationData.default

我认为教程与最新版本的库不同步

【讨论】：

这为我修好了