I have the following NextJS component which renders a list of people .. I also have a delete button which opens a modal and asks if you want to delete said person, but i cant figure out how to pass the id to the function through the modal so its not working at all.
const peoples = [
{ id: 1, name: 'Scott'}
{ id: 2, name: 'Luke'}
{ id: 3, name: 'Hannah'}
{ id: 4, name: 'Reg'}
]
const Peoples = () => {
const [confirmPersonDeleteModal, setConfirmPersonDeleteModal] = useState(false)
const handleDeletePerson = () => {
console.log('Deleting')
}
return (
<>
<ConfirmModal
open={confirmPersonDeleteModal}
onClose={() => setConfirmPersonDeleteModal(false)}
title="Delete Person"
onConfirm={handleDeletePerson}
>
Are you sure you want to delete this person?
</ConfirmModal>
{peoples.map((people) => (
<>
<p>{people.name} - {people.id}</p>
<a onClick={() => setConfirmPersonDeleteModal(true)}>Delete</a>
</>
))}
</>
)
}
export default Peoples
from NextJS passing id of record to a function with a modal
No comments:
Post a Comment