javascript - 将父组件中的: Pass image from this.状态 react 到子组件

Question

我有一个图像已导入到 React 类组件中，如下所示:

import Hat3 from './assets/hat3/hat3.png';

要在此组件中显示此图像，我可以执行以下操作:

<img src={hat3} />

我有一个名为FeaturedItem的子组件，如下所示:

<FeaturedItem hat={this.state.hat3}/>

我想通过hat3通过 prop hat 将图像发送到 FeaturesedItem 组件。我如何存储 hat3图像处于状态以便我可以将其传递给功能性FeaturedItem组件？

我尝试过以下方法:

constructor(props) {
        super(props);

        this.state = {
           // Doesn't work
           hat3: {hat3}
           // Doesn't work
           hat3: ${hat3}
           // Doesn't work
           hat3: `${hat3}`
        };
    }

将此图像存储在状态中的正确方法是什么，以便我可以通过 props 将其传递给子组件并在子组件中显示它？

Answer 1

尝试下面的代码

this.state = {
    hat3: Hat3
};

如果这不起作用，请分享您遇到的错误。