JSX元素類型'xxx'不是JSX元素的構造函數。屬性'yyy'在類型'xxx'中受到保護，但類型爲'ElementClass'的公共類型爲

Question

我試圖從名爲Voyager的項目中導入名爲Vega-Lite的React類。

這裏是我的代碼：

import * as React from 'react'; 
import {VegaLite} from 'datavoyager/build/components/vega-lite'; 

export interface Props { 
    spec: any; 
    logger: any; 
} 

export const View = ({spec, logger}: Props) => { 
    return(
    <VegaLite spec={spec} logger={logger}/> 
); 
}; 

這裏是我的錯誤：

[ts] JSX element type 'VegaLite' is not a constructor function for JSX elements. Property 'componentDidMount' is protected in type 'VegaLite' but public in type 'ElementClass'.

我知道，在課堂上Vega-Lite，功能componentDidMount()確實protected。但是，我該如何解決這個錯誤？

PS：我已經嘗試在我的tsconfig.json中設置allowSyntheticDefaultImports到true，但同樣的錯誤依然存在。

Answer 1

您需要將您的反應類型降級到15.0.25版本以下。從15.0.25版本開始，所有的生命週期方法都被強制公開。

這裏有一個問題吧：https://github.com/DefinitelyTyped/DefinitelyTyped/issues/16893

更好的解決方案在voyager回購來創建一個問題，它會告訴他們，他們的成分是不符合新的反應分型。他們使用^15.0.8。