Question

我正在使用 recharts 在 React 中构建图表——我在这里使用了他们文档中的一个示例：https://codesandbox.io/s/zen-ellis-30cdb?file=/src/App.tsx

在codesandbox中，项目编译运行，但是你可以在第53行的代码中看到错误提示（并且它在控制台中生成了很多警告）。

在我的本地项目中，它无法编译并将错误打印到屏幕上。这是什么原因造成的，能否修复？

Overload 1 of 2, '(props: Readonly<Props>): Line', gave the following error.
  Type '{ dataKey: string; data: { category: string; value: number; }[]; name: string; key: string; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<Line> & Pick<Readonly<Props> & Readonly<{ children?: ReactNode; }>, "string" | ... 474 more ... | "animationId"> & Partial<...> & Partial<...>'.
    Property 'data' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<Line> & Pick<Readonly<Props> & Readonly<{ children?: ReactNode; }>, "string" | ... 474 more ... | "animationId"> & Partial<...> & Partial<...>'.
Overload 2 of 2, '(props: Props, context?: any): Line', gave the following error.
  Type '{ dataKey: string; data: { category: string; value: number; }[]; name: string; key: string; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<Line> & Pick<Readonly<Props> & Readonly<{ children?: ReactNode; }>, "string" | ... 474 more ... | "animationId"> & Partial<...> & Partial<...>'.
    Property 'data' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<Line> & Pick<Readonly<Props> & Readonly<{ children?: ReactNode; }>, "string" | ... 474 more ... | "animationId"> & Partial<...> & Partial<...>'.  TS2769

  130 |                         {/*{buildSeries()}*/}
  131 |                         {series.map(s => (
> 132 |                             <Line dataKey="value" data={s.data} name={s.name} key={s.name} />
      |                                                   ^
  133 |                         ))}
  134 |                     </LineChart>
  135 |                 }```

Answer 1

折线图中不存在道具数据，您应该在AreaChart包装器中传递它

recharts 中的`没有重载匹配这个调用`

1 个答案: