Не могу вставить картинку в map на react

Question

Саму картинку в React можно вставить через import или require Но у меня другая проблема. Я работаю с .json, где указан путь к картинке. Для работы с массивом использую map, но когда указываю путь, сам файл он не находит.введите сюда код

import React, { useEffect } from 'react'
import '../styles/forum.scss'
import data from '../data/persons.json'

const Forum = () => {


  return (
    <div>
        <div className="forum">
            {
                data.map((person) => 
                    <div key={person.name} className="card">
                        <img src={person.img} alt="" />
                        <div className="name">{person.name}</div>
                        <div className="age">{person.age}</div>
                        <div className="sex">{person.sex}</div>
                    </div>
                )
            }
        </div>
    </div>
  )
}

export default Forum;

[
    {
        "name": "Химмицу",
        "age": 18,
        "sex": "women",
        "descr": "подруга детства Николая. Она добра, заботлива, всегда беспокоится о нём, иногда даже бывает слишком назойливой. Однако устраивает ли её простая дружба? Возможно, за годы преданности она заслужила нечто большее?",
        "img": "../data/image/person/Ketrin1.png"
        
    },
    {
        "name": "Кетрин",
        "age": "18",
        "sex": "women",
        "descr": "",
        "img": "../data/image/person/Ketrin1.png"
    },
    {
        "name": "Эли",
        "age": "18",
        "sex": "women",
        "descr": "",
        "img": "../data/image/person/Ketrin1.png"
    },
    {
        "name": "Кагоме",
        "age": "18",
        "sex": "women",
        "descr": "",
        "img": "../data/image/person/Ketrin1.png'"
    }
]

БЛОГ НА HUSL

Не могу вставить картинку в map на react

Ответы (0 шт):