Question

我正在尝试从.json文件中将图像显示在我的部分中。因此，像往常一样，我向组件添加了一个prop并解析了config.dog.src .json文件的值。我通过控制台进行打印，然后在控制台中与dog.png一起完美显示值。但是，在inspect元素中的代码中，它显示[object Object]。有想法吗？

我尝试过更改.json文件，并进行了硬编码，但这违背了.json文件的目的，因此不要真的想要这样做。

dog:{
    src: "dog.png"
} 

<DogComponent src={config.dog.src} />

控制台检查元素显示以下内容：

<img src=[object Object] />

预期输出应为：

<img src="dog.png" />

Answer 1

听起来像您可能缺少webpack的{ test: /\.(jpe?g|png)$/i, include: path.resolve(__dirname, './'), loaders: ['file-loader'] }。将此添加到您的webpack配置模块部分，并确保您正在通过可解析的路径导入映像，并且该映像应该可以正常工作：

default_app_config = 'Accounts.apps.AccountsConfig'

检查元素中的图像src显示为[object Object]

1 个答案: