Источник изображения в Inspect Element отображается как [object Object]
Я пытаюсь, чтобы изображение отображалось в моем разделе из моего файла .json. Итак, как всегда, я добавил свойство к компоненту и проанализировал значения файла .json, который представляет собой config.dog.src . Я печатаю это в консоли, и значение отлично отображается с dog.png в консоли. Однако в коде элемента проверки отображается [object Object]. Есть идеи?
Я пытался изменить файл .json и жестко кодировать, но это противоречит цели файла .json, поэтому на самом деле не хочу этого делать.
dog:{
src: "dog.png"
}
<DogComponent src = {config.dog.src} />
Консольный элемент проверки показывает следующее:
<img src=[object Object] />
Ожидаемый результат должен быть:
<img src = "dog.png" />
Ответы 1
Похоже, вам может не хватать file-loader для webpack. Добавьте это в раздел модуля конфигурации вашего веб-пакета и убедитесь, что вы импортируете изображение по разрешаемому пути, и оно должно работать:
{
test: /\.(jpe?g|png)$/i,
include: path.resolve(__dirname, './'),
loaders: ['file-loader']
}
Спасибо! Казалось, это помогло, а также исправить много ошибок с другими изображениями. :)