React - 如何将本地图像导入/导入Object

Question

我在 create-react-app 项目中使用this库作为照片库。

以http格式加载图片正常 即：

 const IMAGES = [{
            src: "https://c2.staticflickr.com/someimage.jpg"
            ....  
         }];

如何将本地图像文件导入对象，就像上面的示例一样？

即：

const IMAGES = [{
        src: "my local path",
        thumbnail: "my local path",   
     }];

我已经尝试过：

Gallery.js

（ps：路径正确，images目录确实驻留在我的src目录中）

import logo from "../images/site/logo.jpg";
export default { logo };

App.js

到目前为止我尝试过的所有不同方式：

import logo from "./Gallery";
const IMAGES = [{
        src: `${logo}`, //no dice
        src: {logo}, //no dice
        src: <logo/>, //no dice
        src: "../images/site/logo.jpg" //no dice

        ....  
     }];

html控制台检查员说：<img src="[object Object]" ...

Answer 1

看起来您正在从Gallery.js导出对象，因此请尝试logo.logo。如果您logo，则可以只使用export default logo。

const IMAGES = [{
  src: logo.logo
}];

Answer 2

徽标是一个对象，因此您需要引用logo.logo

const IMAGES = [{
        src: `${logo.logo}`, //no dice
        src: {logo.logo}, //no dice
        ....  
     }];