小编pae*_*shi的帖子

我正在通过数据进行映射，我想单击图像并显示一个包含 data.title 和 data.info 的模式弹出窗口。每个模式仅显示我的数组中的最后数据。我读到所有模态都一起弹出，但我只看到最后一个，但我不太明白如何解决问题，尤其是 React 中的函数组件。TIA

 export default function SomeComponent   
 const [modalIsOpen, setModalIsOpen] = 
 useState(false);
 const customStyles = {
  content: {
    top: '35%',
    left: '50%',
    right: 'auto',
    bottom: 'auto',
    marginRight: '-50%',
    width: '60%',
    transform: 'translate(-40%, -10%)',
  },
}
  return (
    <div className="container">


    { somedata.map((data) => 
    (<div className='item' key={data.id} >
    <img src={data.img} alt='' onClick={()=> setModalIsOpen(true)} />
    <Modal isOpen={modalIsOpen} onRequestClose={() => setModalIsOpen(false)} style={customStyles}>
      <h1>{data.title</h1>
      <p>{data.content</p> 
    <div>
    <button onClick={() => setModalIsOpen(false)}>X</button>
    </div>
    </Modal>
   </div>))}
 </div>
</div>
  );}