React 图像源不需要读取变量答案

【问题标题】：React image source require not reading variablesReact 图像源不需要读取变量
【发布时间】：2018-09-19 21:24:11
【问题描述】：

我正在尝试通过props 动态渲染图像。

当我对img src 进行硬编码时，我可以渲染图像：

<img src={require('uploads/logo2-1537302321809.png')} />

当我尝试通过props 进行渲染时

<img src={require(`${profile.image.URL}`)} />

我收到一个错误：

错误：找不到模块“uploads/logo2-1537302321809.png”。

【问题讨论】：

标签： reactjs

【解决方案1】：

试试这个

const picture = 'picture.jpg';
<img src = {require(`./images/${picture}`)}/>

【讨论】：

【解决方案2】：

我认为this 应该可以帮助您。关键是您正在创建一个单独的组件，您可以在其中存储所有图像并在需要时调用它们。

示例：

“图像存储”：

    const images = {
    something: require(‘./path/image’)
};
export default Images;

导入：

import Images from ‘whatever_you_name_this’;

<img source={Images.something} />

【讨论】：