Question

这是特定于我从标准ES2015转换为Typescript的React应用程序。在我的.tsx文件中（从常规的.js文件转换而来）我得到了一些我不知道如何解决的打字稿错误。

第一个是：error TS2339: Property 'propTypes' does not exist on type 'typeof App'.

这适用于：

App.propTypes = {
  actions: PropTypes.object.isRequired,
  fuelSavingsAppState: PropTypes.object.isRequired
};

我尝试在该代码上创建一个定义App的接口，如：

interface App {
    propTypes?: any;
}

但这没有效果。显然我是新手稿的原因，所以我错过了什么？

另一个错误是：

error TS2605: JSX element type 'Element' is not a constructor function for JSX elements.
  Property 'render' is missing in type 'Element'

这适用于：

{settings.necessaryDataIsProvidedToCalculateSavings ? <FuelSavingsResults savings={settings.savings} /> : null}

该错误特指有关<FuelSavingsResults

的位

完全失去了从哪里开始。任何建议都是最受欢迎的。

如果有帮助，FuelSavingsResults的定义如下：

let FuelSavingsResults = (props) => {
    let savingsExist = NumberFormatter.scrubFormatting(props.savings.monthly) > 0;
    let savingsClass = savingsExist ? 'savings' : 'loss';
    let resultLabel = savingsExist ? 'Savings' : 'Loss';

然后有一个常规的React渲染方法，但我认为这不重要。

Answer 1

错误TS2339：'typeof App'类型中不存在属性'propTypes'。

而不是

class App extends React.Component{
}
App.propTypes = {
  actions: PropTypes.object.isRequired,
  fuelSavingsAppState: PropTypes.object.isRequired
};

使用static属性。

class App extends React.Component{
    static propTypes = {
      actions: PropTypes.object.isRequired,
      fuelSavingsAppState: PropTypes.object.isRequired
    };
}

错误TS2605：JSX元素类型'Element'不是JSX元素的构造函数。 “元素”类型中缺少属性“render”

这是编译器中已修复的错误：https://github.com/Microsoft/TypeScript/issues/6349替代方案为props提供了类型注释。

Answer 2

propTypes真的需要吗？在编译时无法检查propTypes在运行时检查的接口？

MyCustomer

或者如果你使用哑组件

interface IApp{
  actions:any;
  fuelSavingsAppState: (props:any)=> void;
}

class App extends React.Component<IApp,{}>{
}

注意：如果您使用的是对象，请为其创建一个界面。就像现在给出的任何理想情况下的行为一样。

转换React项目时的Typescript错误

2 个答案: