🐛【基础明细表】meta.formatter渲染数据错误

[zj-93]

🏷 Version

官网线上运行
https://s2.antv.antgroup.com/examples/basic/table/#table
https://s2-v1.antv.antgroup.com/examples/basic/table/#table
v1，v2版本都存在相同问题

Sheet Type

• TableSheet

🖋 Description

最后一行数据【ICU(普外科)】，key为【ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422】的值，应该对应的是filelds里面的【患者住院总死亡率】【ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422】，但现在打印出来对应到【科室】了，导致数据没法格式化

⌨️ Code Snapshots

import { TableSheet } from '@antv/s2';
const container = document.getElementById('container');

let data = [
{
"13": "",
"ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422": "0"
},
{
"13": "ICU",
"ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422": "0.3409090909"
},
{
"13": "ICU(RICU)",
"ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422": "0.2783505155"
},
{
"13": "ICU(中医科)",
"ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422": "0"
},
{
"13": "ICU(产科)",
"ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422": "0"
},
{
"13": "ICU(全科医疗老年病科)",
"ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422": "1"
},
{
"13": "ICU(内分泌肾病)",
"ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422": "0.2835820896"
},
{
"13": "ICU(口腔科)",
"ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422": "0"
},
{
"13": "ICU(妇科)",
"ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422": "0"
},
{
"13": "ICU(康复医学科)",
"ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422": "0.2222222222"
},
{
"13": "ICU(心血管内科)",
"ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422": "0.3692307692"
},
{
"13": "ICU(急诊科)",
"ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422": "0.204234122"
},
{
"13": "ICU(感染科)",
"ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422": "0.4444444444"
},
{
"13": "ICU(普外科)",
"ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422": "0.2333333333"
},
{
"13": "ICU(泌尿外科)",
"ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422": "0"
},
{
"13": "ICU(消化内科)",
"ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422": "0.3414634146"
},
{
"13": "ICU(烧伤整形科)",
"ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422": "0.2380952381"
}
]
let fields = [
{
"id": "13",
"dataeaseName": "13",
"name": "科室",
"groupType": "d",
"formatterCfg": {
"type": "auto",
"unit": 1,
"suffix": "",
"decimalCount": 2,
"thousandSeparator": true
}
},
{
"id": "2acb132a-17ad-45c4-9ed6-c900a6d01422",
"dataeaseName": "ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422",
"name": "患者住院总死亡率",
"groupType": "q",
"formatterCfg": {
"type": "percent",
"unit": 1,
"suffix": "",
"decimalCount": 2,
"thousandSeparator": true
},
}
]
let columns = []
let meta = []
fields.forEach((ele) => {
columns.push(ele.dataeaseName);
meta.push({
field: ele.dataeaseName,
name: ele.name,
formatter: function (value) {
console.log(ele.groupType, value)
if (ele.groupType == 'q') {
return
} else {
return value;
}
},
});
});

const s2DataConfig = {
fields: {
columns: columns
},
meta: meta,
data,
};

const s2Options = {
width: 600,
height: 480,
showSeriesNumber: true,
};

const s2 = new TableSheet(container, s2DataConfig, s2Options);

s2.render();

🔗 Reproduce Link

https://s2.antv.antgroup.com/examples/basic/table/#table
https://s2-v1.antv.antgroup.com/examples/basic/table/#table

🤔 Steps to Reproduce

😊 Expected Behavior

最后一行数据【ICU(普外科)】，key为【ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422】的值，应该对应的是filelds里面的【患者住院总死亡率】【ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422】，但现在打印出来对应到【科室】了，导致数据没法格式化

经过实验，发现当key数值是N，就【N+1】有问题，例如我的是13，那第14行就有问题

💻 System information

window 10(64)
130.0.6723.59

-->

Environment	Info
System
Browser

[lijinke666]

formatter 里面依赖了外部的 ele 做判断, 你这里也不是闭包, formatter 是动态执行的, 应该根据 formatter 提供的数据来做判断

这样写即可, 判断 field

    formatter(value, data, meta) {
      if (Object.keys(data)[0] == 'ca0fd21e17ab4014b5fcd8d17ede45e5_none_0_2acb132a-17ad-45c4-9ed6-c900a6d01422') {
      } else {
        return value;
      }
    },

PS. 粘贴代码请格式化一下, 看着好难受