javascript - 使用数据库中的多个 API 结果填充表，为什么我的结果重复而不是正确附加？

Question

JS代码

我在第一个函数中调用案例信息以获取联系人和站点的名称，因为它们存在于单独的模型中。Case 和 caseDetail 通过多个因素关联，但是出于 UI 目的，我希望显示每个因素的实际名称，而不仅仅是关联信息的 ID。

我相信我在解决方案中的另一个机会是将这两个模型结合起来，因此所有信息都存在于一次调用中，从而使我的循环结果具有所有正确的信息。 表返回结果的屏幕截图

        //    $tbody.empty(); 
            await axios.get('/api/Case').then((response) => {
                response.data.forEach((response) => {
                    console.log(response);
                    const caseContactName = response.Contact.name;
                    const caseSiteName = response.Site.siteName;
                    callRmaInvent(caseContactName, caseSiteName)
    
                })
            }).catch((err) => {
                console.log(err);
            })
            
        }

        const callRmaInvent = async (caseContactName, caseSiteName) => {

        console.log(caseSiteName, caseContactName);
       await axios.get('/api/caseDetail').then((items) => {
        $tbody.empty();
        console.log(items);
        console.log('inventory will go here');
        items.data.forEach((item) => {
            const id = item.id;
            // Table data
            const caseName = item.Case.caseName;
            const caseSite = caseSiteName;
            const caseContact = caseContactName;
            const itemType = item.Part.partType;
            const serialNumber = item.Part.serialNumber;
            const createdAt = item.createdAt;
            const updatedAt = item.updatedAt;
            const faultReason = item.Fault.reasonForReturn;
            const dispositionAction = item.Disposition.actionTaken;
            const addedToInvent = dateFns.format(createdAt, 'MMM D, YY')
            const updatedInvent = dateFns.format(updatedAt, 'MMM D, YY')

            $tbody.append(`
            <tr>
            <td>${id}</td>
            <td>${caseName}</td>
            <td>${caseSite}</td>
            <td>${caseContact}</td>
            <td>${serialNumber}</td>
            <td>${itemType}</td>         
            <td>${faultReason}</td>
            <td>${dispositionAction}</td>
            <td>${addedToInvent}</td>
            <td>${updatedInvent}</td>
            </tr>`)
        });
    }).catch((err) => {
        console.log(err)
    });   
    };
$(document).on('click', '#viewDatabase', (event) => {
    event.preventDefault();
    callRmaInvent();
    callRmaCases();
}) 

控制台日志示例以查看它在每次调用中提取正确的信息

script.js:37 Disney World Blake Thompson
script.js:37 Warehouse Eric

标签： javascriptexpressaxiossequelize.js