获取JSON对象值填充DataTable时仅显示单个字符的问题

问题原因 #

当直接将字符串数组传给DataTables的data参数时，组件会默认把每个字符串视为字符数组，逐字符渲染成表格行，导致只显示单个字符。你的stock_data是通过split(";")得到的字符串数组，直接传入就会触发这个问题。

解决方案 #

需要把字符串数组转换为DataTables期望的格式——二维数组（每个元素作为一行的单列数据），修改代码如下：

eventClick: function(info) {
    let text = info.event.extendedProps.procs;
    // 分割字符串为数组，同时过滤掉可能的空字符串（比如末尾的分号导致的空元素）
    var stock_data = text.split(";").filter(item => item.trim() !== "");
    // 将字符串数组转为二维数组，每个元素作为一行的单列数据
    var tableData = stock_data.map(item => [item]);

    $("#tblProcedimientos").DataTable({
        destroy: true,
        data: tableData,
        columns: [
            { title: "Procedimientos" } // 自定义列标题
        ],
        language: {
            emptyTable: "No hay datos disponibles para mostrar",
            zeroRecords: "No hay datos disponibles para mostrar",
            url: "//cdn.datatables.net/plug-ins/1.10.11/i18n/Spanish.json",
        },
        ordering: false,
    });
    $("#DatosEvento").modal({ backdrop: "static", keyboard: false });
}

关键修改点 #

• 使用filter方法移除split后可能产生的空字符串（比如原文本末尾有分号的情况）
• 通过map将每个字符串包装成数组，形成二维数组，让DataTables正确识别每行数据
• 添加columns配置定义列标题，确保表格结构清晰
• 移除了多余的JSON.parse(JSON.stringify(obj))步骤，split已直接返回数组，无需额外序列化解析

内容的提问来源于stack exchange，提问作者Ing. José Pérez