rechart 的 Legend 内容的正确类型是什么？

问题描述

在我正在帮助处理的应用中，有一个带有图例的 rechart 图表渲染，如下所示：

<Legend
  content={renderLegend}
/>

renderLegend 定义为以下函数：

const renderLegend = (props) => {
  const { payload } = props;

  return (
    <ul>
      {
        payload.reverse().map((entry,index) => (
          <li key={`item-${index}`}>
            <span style={{backgroundColor: entry.color}} />
            <span>{entry.payload.value}</span>&nbsp;{entry.value}
          </li>
        ))
      }
    </ul>
  );
};

这个函数建议 props.payload 的类型应该是这样的：

interface props {
  payload: {
    color: string;
    value: string;
    payload: {
      value: string;
    }
  }[];
}

在 TS 中，我想适当地键入函数 renderLegend 但这种类型似乎不存在。 content 组件的属性 Legend 采用 ContentType 转换为 ReactElement | (props: Props) => Element 其中 Props does 包含 {{1} } 属性，但如果我尝试访问它，我发现它没有 payload 属性。 值得一提的是，这个工作按原样使用，是用 Typescript 编写的，没有打字。我正在尝试添加输入以更好地访问此 value。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）