在更新过程中,它每次都会更新相同id值的信息,这可能是什么问题?例如,它在每次更新操作中都会更新id为3的字段。我在更新过程的循环中使用索引值
{cardItemData.map((cardItem, index) => (
<>
<tr id={index}>
<td>{cardItem.min}</td>
<td>{cardItem.price}</td>
<td>
<Dropdown>
<DropdownToggle
hasIcon={false}>
<Button
icon='MoreHoriz'
color='dark'
/>
</DropdownToggle>
<DropdownMenu>
<DropdownItem>
<Button
ref={cardId}
id={
cardItem.id
}
onClick={() => {
dispatch(
agencySlice.removeUpdateItem(
index,
),
);
}}
icon='trash'
size='sm'
isOutline={
!darkModeStatus
}
color='dark'
isLight={
darkModeStatus
}
className={classNames(
'text-nowrap',
{
'border-light':
!darkModeStatus,
},
)}>
{t(
'pages.users.buttonDelete',
)}
</Button>
</DropdownItem>
<DropdownItem>
<Button
onClick={() =>
setModalState(
!modalState,
)
}
tag='a'
to
icon='pencil'
size='sm'
isOutline={
!darkModeStatus
}
color='dark'
isLight={
darkModeStatus
}
className={classNames(
'text-nowrap',
{
'border-light':
!darkModeStatus,
},
)}>
{t(
'pages.users.buttonEdit',
)}
</Button>
</DropdownItem>
</DropdownMenu>
</Dropdown>
</td>
</tr>
<Modal
titleId
isOpen={modalState}
setIsOpen
isStaticBackdrop
isScrollable
isCentered
size
isAnimation>
<ModalHeader
className
setIsOpen={() =>
setModalState(false)
}>
<ModalTitle id>
Düzenle
</ModalTitle>
</ModalHeader>
<ModalBody>
<div className='row'>
<div className='col-lg-4'>
<FormGroup
id='cardMinUp'
label={t(
'form.cardMin',
)}
isFloating>
<Input
type='number'
placeholder={t(
'form.cardMin',
)}
isValid={
formik.isValid
}
value={
formik
.values
.cardMinUp
}
onChange={
formik.handleChange
}
isTouched={
formik
.touched
.cardMinUp
}
invalidFeedback={
formik
.errors
.cardMinUp
}
/>
</FormGroup>
</div>
<div className='col-lg-4'>
<FormGroup
id='cardPriceUp'
label={t(
'form.cardPrice',
)}
isFloating>
<Input
type='number'
placeholder={t(
'form.cardPrice',
)}
isValid={
formik.isValid
}
value={
formik
.values
.cardPriceUp
}
onChange={
formik.handleChange
}
isTouched={
formik
.touched
.cardPriceUp
}
invalidFeedback={
formik
.errors
.cardPriceUp
}
/>
</FormGroup>
</div>
<div className='col-lg-4 mt-2'>
<Button
onClick={() => {
dispatch(
agencySlice.editUpdateCardItem(
{
id: index,
min: formik
.values
.cardMinUp,
price: formik
.values
.cardPriceUp,
},
),
);
setModalState(
false,
);
}}
className='me-3'
icon='plus'
isOutline
color='info'>
Kaydet
</Button>
</div>
</div>
</ModalBody>
</Modal>
</>
))}