打字稿抱怨使用 React.createClass 时类型“JSX.IntrinsicElements”上不存在属性？

Question

我正在使用 typescript 编写 redux 应用程序。

 var item = React.createClass({
  render: function() {
    return (<div>hello world</div>)
  }
});

export default class ItemList extends Component<any, any> {
    render() {
        return (<item />)
    }
}

然后打字稿抱怨这个：

 Property 'item' does not exist on type 'JSX.IntrinsicElements'.

原文由 roger 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您的组件必须以大写字母 I 而不是小写字母 i ，否则 TypeScript 会大喊大叫。将 item 更改为 Item 应该修复它：

 var Item = React.createClass({
  render: function() {
    return (<div>hello world</div>)
  }
});

export default class ItemList extends Component<any, any> {
    render() {
        return (<Item />)
    }
}

原文由 Rajeesh Madambat 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

您可以像这样声明您的自定义元素类型：

 import * as React from 'react'

declare global {
  namespace JSX {
    interface IntrinsicElements {
      item: React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
    }
  }
}

原文由 Sinapcs 发布，翻译遵循 CC BY-SA 4.0 许可协议