且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

如何根据动态数据的反应将图像加载到页面上?

更新时间:2023-10-16 21:18:34

如果

import egypt from '../images/egypt.svg'

<div>
   <img src={egypt}/>
</div>

在您的代码中正常工作,并且您已经正确配置了Webpack,通过在模板文字(如

works in your code and you have configured the webpack properly, you would be able to dynamically display the image in React by requiring them with the help of template literals like

<img src={require(`${obj.optionOne.img}`)}

还要确保使用命令安装url loader

Also make sure you install url loader with command

npm install -s url-loader

您需要将webpack配置为url-loader

 {
        test: /\.(jpe?g|png|gif|svg)$/,
        use:['url-loader']
    }