Получение уникального идентификационного номера записи в реакции ⇐ CSS

[Anonymous]

Я пытаюсь отправить данные из одной таблицы моей базы данных в другую. В моем интерфейсе у меня есть таблица, в которой отображаются сведения о записях/данных таблицы, из которой я пытаюсь скопировать. Для каждой записи у меня есть кнопка подтверждения, которая при нажатии отправляет данные строки одной записи в другую таблицу. Я получаю сообщение об ошибке: все записи отправляются в другую базу данных, и цикл продолжается.
Вот мой код интерфейса:

Код: Выделить всё

import React, { useState, useEffect } from "react";
import axios from "axios";
import '../css/Approve_user.css';

function Approve_user() {

const [pendinguser, setPendinguser] = useState([])
useEffect(()=> {
axios.get('http://localhost:5500/getpendingdata')
.then(res=>setPendinguser(res.data))
.catch(err=>console.log(err))
}, [])

const handleApprove = (i) => {
axios.post('http://localhost:5500/approveduser', i)
.then(res => {
if(res.data.Status === 'Success'){
alert("User Approved Successfully!");
window.location.reload()
}
else{
alert(res.data.Error);
}
})
.catch(err => console.log(err));
}

return(


Approve New Users Section
Select and Decline Users




Ticket ID
First Name
Last Name
Username
Gender
Location
Phone No.
Email
Category
Skill
Action



{
pendinguser.map((data, i) => (

{data.pending_user_ID}
{data.pending_user_firstname}
{data.pending_user_lastname}
{data.pending_user_username}
{data.pending_user_gender}
{data.pending_user_location}
{data.pending_user_phone_no}
{data.pending_user_email}
{data.pending_user_category}
{data.pending_user_skill}

Approve
Delete


))
}




)
}

export default Approve_user;

А вот мой внутренний код:

Код: Выделить всё

app.post('/approveduser', (req, res) => {
const sql = "INSERT INTO users(`user_firstname`, `user_lastname`, `user_username`, `user_gender`, `user_location`, `user_phone_no`, `user_email`, `user_password`, `user_category`, `user_profilepic`, `user_skill`) SELECT `pending_user_firstname`, `pending_user_lastname`, `pending_user_username`, `pending_user_gender`, `pending_user_location`, `pending_user_phone_no`, `pending_user_email`, `pending_user_password`, `pending_user_category`, `pending_user_profilepic`, `pending_user_skill` FROM pending_users WHERE pending_user_ID=?";

const approve_ID = req.body.i;

db.query(sql, [approve_ID], (err, result) =>  {
if(err) return res.json({Error: err});
else return res.json({Status: "Success"});
})
})

Предположим, данные таблицы предназначены для записей. Поэтому я ожидаю, что для каждой записи будет две кнопки отправки. Поэтому, когда я нажимаю кнопку утверждения для записи A, я ожидаю, что запись A будет скопирована из таблицы pending_users в таблицу пользователей, и то же самое, если я нажму кнопку утверждения для записи B.

Подробнее здесь: https://stackoverflow.com/questions/791 ... d-in-react