JSX元素类型'CounterDisplay'不是JSX元素的构造函数。财产'refs'的类型是不相容的

时间:2017-03-10 14:18:18

标签: visual-studio reactjs typescript react-jsx

我从版本1.6更新了打印机到版本2.1.6,并且对版本15.0.15作出了反应。如果我通过gulp或tsc编译typescript文件一切正常,没有错误消息。但是,Visual Studio 2017 RC以及Sublime Text会抱怨打字稿代码。

以下是我的一些代码。这不会产生任何错误。

interface CounterDisplayProps {
    loading: boolean;
    first: number;
    last: number;
    total: number;
}

class CounterDisplay extends React.Component<CounterDisplayProps, {}> {
    render() {
        var { props } = this;
        return (
            <div className="Counter">
                Showing {props.first} to {props.total ? Math.min(props.last, props.total) : props.last} of {props.loading ? "?" : props.total} entries
            </div>
    )}
}

另一个组件的渲染功能包含:

<CounterDisplay 
    loading={props.counterIsLoading}
    first={props.skip + 1}
    last={props.skip + props.take}
    total={props.counter} />

上面的代码产生了Visual Studio 2017和Sublime Text中的错误:

JSX element type 'CounterDisplay' is not a constructor function for JSX elements.
Types of property 'refs' are incompatible.
Type '{ [key: string]: ReactInstance; }' is not assignable to type '{
[key: string]: Component<any, any>; }'.
Index signatures are incompatible.
Type 'ReactInstance' is not assignable to type 'Component<any, any>'.
Type 'React.Component<any, any>' is not assignable to type 'React.Component<any, any>'. Two different types with this name exist, but they are unrelated.
Types of property 'refs' are incompatible.
Type '{ [key: string]: ReactInstance; }' is not assignable to type '{
[key: string]: Component<any, any>; }'.
Index signatures are incompatible.
Type 'ReactInstance' is not assignable to type 'Component<any, any>'.
Type 'React.Component<any, any>' is not assignable to type 'React.Component<any, any>'. Two different types with this name exist, but they are unrelated.

Visual Studio和Sublime Text每当我使用react组件时都会抱怨,我自己写的。我想知道为什么这个代码在使用编译器时工作但在使用IDE时没有。你能救我吗?

1 个答案:

答案 0 :(得分:0)

感谢Ryan的帮助。 react的旧类型定义仍然作为我项目的文件夹结构中的文件存在。但是他们没有被引用。一旦删除文件,Visual Studio就不再显示任何错误。