javascript - React Lottie 不显示动画不显示（网络）

Question

我正在尝试一个简单的 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

标签： javascripthtmlreactjslottie

Answer 1

尝试不* as导入，例如：

import animationData from './globe.json'