React map iterates through the array, showing how to modify one of the images through variables on the page.

problem description

I have an array that is displayed on the page through map. When I click on one of the pictures, the corresponding gray picture changes to blue

the environmental background of the problems and what methods you have tried

< H2 > Code: < / H2 >

clipboard.png

:

clipboard.png

< H2 > Click the red area of the effect picture, and the corresponding picture changes from gray to blue < / H2 >
Jun.05,2022


<Img />item.visibleColorImgurlthis.state.advListchangeColorthis.state.visibleChange , changeColor

changeColor =() => {
     const _newList = this.state.advList.map((item,key) => {
        let visibleColor= true;
        
        if (key !== index) { // 
             visibleColor= false
        }
        return Object.assign({}, item, {visibleColor: visibleColor})
     });
     this.setState({
         advList: _newList
     });
}
Menu