javascript - React - 如何将本地镜像导入/获取到对象中

Question

我正在使用 this create-react-app 项目中的相册库。

以 http 方式加载图像工作正常即:

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

如何将本地镜像文件源到对象中，就像上面的示例一样？

即:

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

我已经试过了:

Gallery.js

(ps:路径正确，图像目录确实位于我的 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 ，则可以只使用 Logo 。

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