您可以在Recharts中的图表有效负载中传递自定义对象

const data01 = [
  {
    name: "Error 1",
    value: 90,
    customValue: [
      { name: "test1", value: 4 },
      { name: "test2", value: 8 }
    ]
  },
  {
    name: "Error 2",
    value: 25,
    customValue: [
      { name: "test1", value: 5 },
      { name: "test2", value: 9 }
    ]
  },
  {
    name: "Error 3",
    value: 10,
    customValue: [
      { name: "test1", value: 6 },
      { name: "test2", value: 10 }
    ]
  }
];

创建自定义工具提示

const CustomTooltip = ({ active, payload, label }) => {
  if (active && payload && payload.length) {
    console.log(payload);
    return (
      <div className="custom-tooltip">
        {payload[0].payload.customValue?.map((obj) => {
          return (
            <>
              {" "}
              <p className="label">{`${obj.name}`}</p>
              <p className="label">{`${obj.value}`}</p>{" "}
            </>
          );
        })}
      </div>
    );
  }

这是一个沙箱，显示了我的示例https://codesandbox.io/s/rechart-piechart-forked-wzygxg?file=/src/App.js
如果饼图中的值是customValue中值的总和，则需要先计算它们的总和，然后再将它们传递给饼图，如下所示

data01.forEach( data => data.value = data.customValue.reduce((s, b) => s + b.value, 0))