Рендеринг изображений в React

Question

Я не могу получить изображения для отображения в своем приложении реакции, созданном с помощью create-реагировать-приложение.Это моя структура каталогов:

build
node_modules
public
src
  assets
  components
    header
      ImportingComponent.js
  data
    data.js
  css

Путь к изображению находится в объекте в каталоге данных в файле data.js

import asdfgProfile from "../assets/IMG_20181128_182110.jpg";
import zxcvbProfile from "../assets/38492604_10157553680894256_362213635956670464_n.jpg";

const f =[
    {
        "name": "asdfg",
        "thumbnail": {asdfgProfile}
    },
    {
        "name": "zxcvb",
        "thumbnail": {zxcvbProfile}
    }

];
export default founders;

Это код в компоненте, которыйназывает это,

{props.founders.map( item =>
        <div className="firstFounder">
             <img src={(item.thumbnail)}></img>
             <h2>{item.name}</h2>
             <h3> {item.designation}</h3>
             <p>{item.blurb}</p>
        </div>
 )}

Изображение не выглядит.Что я тут не так делаю.

Answer 1

const f =[
    {
        "name": "asdfg",
        "thumbnail": {asdfgProfile}
    },
    {
        "name": "zxcvb",
        "thumbnail": {zxcvbProfile}
    }

];

Снимите скобки с {zxcvbProfile}, {asdfgProfile}, вы создаете объект thumbnail: { }, не предоставляя значение.