идентификатор цели события регистрации консоли объекта в массиве в объекте в реакции

Question

Я сопоставляю несколько областей изображения для веб-приложения в ответ, я хочу нацелить их идентификаторы onClick

let targetArea = myMap.find(targetArea => targetArea.id === 10)

let MAP = {
    id: 'map', name: 'my-map',
    areas: [
        {id: 7, name: 'kitchen', shape: 'rect', coords: [804,1001,1019,1135], preFillColor: 'clear'},
        {id: 9, name: 'bar pendant', shape: 'rect', coords: [516,1294,732,1428], preFillColor: 'clear'},
        {id: 10, name: 'entry', href: 'entry', shape: 'rect', coords: [1034,1292,1246,1428], preFillColor: 'clear'}
    ]
};

Я получил массив объектов обратно с console.log(MAP.areas), но яне знаю, как динамически установить идентификатор

, пока у меня есть

const myMap = MAP.areas

let targetArea = myMap.find(targetArea => targetArea.id === 10)

areaCheck = (event) => {
        console.log(targetArea.name)
    }

я получаю правильное имя идентификатора жесткого набора в моей переменной targetArea, я чувствую, что яможет понадобиться цикл idk ??

Answer 1

сначала я передал область в качестве аргумента в обработчике события onClick

onClick={(area)=> this.areaCheck(area)} 

, затем передал ее моему обработчику

areaCheck = (area) => {
        console.log(area.id)
        this.setState({ areaClicked: area.id })
    }

, а затем внезапно понял, о какой области я говорю:)