用打字稿对 js 做出反应

Question

我将 react-plotly.js 与 typescript 一起使用，并从中得到以下错误：

No overload matches this call.
  Overload 1 of 2, '(props: PlotParams | Readonly<PlotParams>): Plot', gave the following error.
    Type '({ type: string; mode: string; x: number[]; y: number[]; marker: { color: string; }; } | { type: string; x: number[]; y: number[]; mode?: undefined; marker?: undefined; })[]' is not assignable to type 'Data[]'.
      Type '{ type: string; mode: string; x: number[]; y: number[]; marker: { color: string; }; } | { type: string; x: number[]; y: number[]; mode?: undefined; marker?: undefined; }' is not assignable to type 'Data'.
        Type '{ type: string; mode: string; x: number[]; y: number[]; marker: { color: string; }; }' is not assignable to type 'Data'.
          Type '{ type: string; mode: string; x: number[]; y: number[]; marker: { color: string; }; }' is not assignable to type 'Partial<BoxPlotData>'.
            Types of property 'type' are incompatible.
              Type 'string' is not assignable to type '"box" | undefined'.
  Overload 2 of 2, '(props: PlotParams, context: any): Plot', gave the following error.
    Type '({ type: string; mode: string; x: number[]; y: number[]; marker: { color: string; }; } | { type: string; x: number[]; y: number[]; mode?: undefined; marker?: undefined; })[]' is not assignable to type 'Data[]'.  TS2769

    20 | };
    21 | 
  > 22 | const Dashboard = () => <div><Plot data={data} layout={layout} /></div>;
       |                                    ^
    23 | 
    24 | export default Dashboard;
    25 |

我用它发送了以下数据，它似乎不起作用。

const data = [{
    type: 'scatter',
    mode: 'lines+points',
    x: [1, 2, 3],
    y: [2, 6, 3],
    marker: { color: 'red' },
}, {
    type: 'bar',
    x: [1, 2, 3],
    y: [2, 5, 3],
}];

const layout = {
    width: 640,
    height: 480,
    title: 'A Fancy Plot',
};

const Dashboard = () => <div><Plot data={data} layout={layout} /></div>;

这与我发送的数据有关吗？ 我安装了 react-plotly 的类型，因此，我收到了这个错误。