尝试执行以下操作（使用rechart的类型）。
但请记住，您必须添加@types/recharts npm包;）

import { TooltipProps } from 'recharts';
import {
  ValueType,
  NameType,
} from 'recharts/src/component/DefaultTooltipContent';

const CustomTooltip = ({
  active,
  payload,
  label,
}: TooltipProps<ValueType, NameType>) => {
  if (active) {
    return (
      <div className="custom-tooltip">
        <p className="label">{`${label} : ${payload?.[0].value}`}</p>
        <p className="desc">Anything you want can be displayed here.</p>
      </div>
    );
  }

  return null;
};

return (
  <ComposedChart data={data}>
    ...
    <Tooltip content={<CustomTooltip />} />
  </ComposedChart>
);

被接受的答案是错误的，并且在正确配置了typescript并且禁止使用任何typescript的项目中将失败。
用途：

const CustomTooltip = ({ active, payload, label }: TooltipProps<number, string>): JSX.Element => {

将number和string更改为数据类型。您也可以将其与ValueType和NameType一起使用，但将其与类型一起声明更有意义。

const CustomTooltip = ({ active, payload, label }: TooltipProps<ValueType, NameType>): JSX.Element => {

通常

TooltipProps<number, string>

而是取决于你的图表数据，所以一般来说

TooltipProps<ValueType, NameType>

这里有一些代码可能对人们有所帮助。我使用的是typescript，我没有使用显式的接口，就像这样的任何类型。

`{ 
                    'time': item.DateTime.getTime(),
                    'data': 1,
                    'change_type': "some_string",
                }`

在你的TSX中，确保像这样传入undefined。网站上的例子没有明确说明就很好，但是我的编辑抱怨了一些错误。<Tooltip content={<CustomTooltip active={undefined} payload={undefined} label={undefined}/>} />
对于CustomToolTip，这对我来说很难理解，payload的索引必须为0，然后调用点运算符，因为那里有一个payload类来访问您的自定义属性，如time，data和change_type

const CustomTooltip = ({ active, payload, label }) => {
    if (active && payload && payload.length) {
      return (
        <div className="custom-tooltip">
          <p className="label">{`${label} : ${payload[0].payload.time}`}</p>
          <p className="label">{`${label} : ${payload[0].payload.data}`}</p>
          <p className="label">{`${payload[0].payload.change_type}`}</p>
          <p className="desc">Anything you want can be displayed here.</p>
        </div>
      );
    }
  
    return null;
  };

然后它应该弹出正确的悬停没有任何问题。

const CustomTooltip = ({
  active,
  payload,
  label,
}: {
  active: boolean;
  label: string;
  payload: {
    payload: {
      value: number
    }
  }[];
}) => {
  if (active) {
    return ( <
      div className = "custom-tooltip" >
      <
      p className = "label" > {
        `${label} : ${payload[0].value}`
      } < /p> <
      p className = "desc" > Anything you want can be displayed here. < /p> <
      /div>
    );
  }

  return null;
};

return ( <
  ComposedChart data = {
    data
  } >
  ...
  <
  Tooltip content = { < CustomTooltip active = {
      false
    }
    payload = {
      []
    }
    label = "" / >
  }
  /> <
  /ComposedChart>
);

@Daria Babakova的回答几乎涵盖了它，但唯一需要注意的是，你不应该从“src”导入。
所以与其说

import {
  ValueType,
  NameType,
} from 'recharts/src/component/DefaultTooltipContent';

最好写

import {
  ValueType,
  NameType,
} from 'recharts/types/component/DefaultTooltipContent';

至少在recharts 2.1.12上，它工作得很好。

这通常对我有效，但其他方法可能是：

const CustomTooltip = ({ active, payload, label }: any) => {