React：将图像从父组件中的 this.state 传递给子组件

Posted 2023-02-23

【中文标题】React：将图像从父组件中的 this.state 传递给子组件

【英文标题】：React: Pass image from this.state in parent component to child component

【发布时间】：2020-04-21 11:35:39

【问题描述】：

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

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

要在此组件中显示此图像，我可以这样做：

<img src=hat3 />

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

<FeaturedItem hat=this.state.hat3/>

我想通过 hat 属性将 hat3 图像传递给 FeaturedItem 组件。如何将hat3 图像存储在状态中，以便我可以将其传递给功能性 FeaturedItem 组件？

我尝试了以下方法：

constructor(props) 
        super(props);

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

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

【参考方案1】：

试试下面的代码

this.state = 
    hat3: Hat3
;

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

【讨论】：

哇。这对我来说是一个非常愚蠢的错误。成功了，谢谢你的帮助。