DataTable 中的多个数组

Posted 2023-05-09

【中文标题】DataTable 中的多个数组

【英文标题】：Multiple Arrays in DataTable

【发布时间】：2021-10-13 08:39:31

【问题描述】：

所以我正在做一个项目，但在尝试在数据表中使用多个数据数组时遇到了麻烦。

我遇到的问题是我的初始数据集来自共享点列表调用（计算变量）。

然后我使用该数组中的值来运行一些计算并将它们放入自己的数组（formulatedNumbers）中。

我的 DataTable 用数据很好地填充了前 6 列（使用计算数组），问题是将第二个数组（formulatedNumbers）放入第 7 列。

我构建数据表的javascript如下

TL;DR 在我使用第一个数组填充第 1-6 列后，我想使用另一个数组填充第 7 列。

function displayCalculations() 
    $("#table_id").dataTable().fnDestroy();
    var calculations = getRateData();
    var formulatedNumbers = [];

    for(i=0; i<calculations.length; i++) 
        formulatedNumbers.push(calculations[i].annum * calculations[i].dailyDecimal * 1000);
    

    console.log(formulatedNumbers);

    $('#table_id').DataTable(
        
            data: calculations,
            "columns": 
            [
                 "data": "startDate" ,
                 "data": "endDate" ,
                 "data": "dayTotal" ,
                 "data": "annum" ,
                 "data": "dailyRate" ,
                 "data": "dailyDecimal" 
            ],
        ); 
 

【参考方案1】：

我建议只为calculations 中的每个项目添加新属性。

function displayCalculations() 
    $("#table_id").dataTable().fnDestroy();
    var calculations = getRateData();

    calculations.forEach(item =>
        item.newField = item.annum * item.dailyDecimal * 1000);

    console.log(calculations);

    $('#table_id').DataTable(
        
            data: calculations,
            "columns": 
            [
                 "data": "startDate" ,
                 "data": "endDate" ,
                 "data": "dayTotal" ,
                 "data": "annum" ,
                 "data": "dailyRate" ,
                 "data": "dailyDecimal" ,
                 "data": "newField"  // + ADDED
            ],
        ); 
 

【讨论】：

啊，好吧，我会试一试并报告！

所以在 forEach 之后 console.log 返回 undefined。我在它之前添加了一个控制台日志并将初始数据拉入，但在 forEach 未定义之后。

所以我删除了你的例子中的计算 = 部分，它起作用了！所以答案将被接受！

没问题！

【参考方案2】：

不要为计算值创建新数组，而是将它们添加到您的其他数据中

calculations = calculations.map(calculation =>

    return calculation.push(calculation.annum * calculation.dailyDecimal * 1000);

【讨论】：

我已经接受了，但请点赞！这也可以。添加到我的数据中并没有发生在我身上，只是因为我没有足够的用途。欣赏替代答案！

这只会将值推送到没有键的数组中，虽然正确吗？

是的，但数据表不需要密钥。它使用索引

确实如此。只是想确认一下！