Reactの子コンポーネントへのProceedをTypescript（TSXファイル）

Question

VS2013を使用して、React（0.14）とTypescript（1.8.5）を使用するように設定しています。 My ReactコードはJSXファイルとして正常に動作します。新しいTSXファイルには私が理解できないエラーが1つあります。すべてのは、ツリーの下のコンポーネントに貼り付け小道具に

は、私が30個の奇妙なエラーが発生した - これらすべてが読み：

プロパティ「nameOfProp」IntrinsicAttributes」タイプに存在しません& IntrinsicClassAttributes> & {} & {子供を？：Reac ... '。

ここでは、TypeScriptを読み上げるコードの例を示します。どんな助けも大いに評価されるでしょう。これは生産上のReactを立ち上げて走らせるための最後のハードルの1つです。注：私はスペースを節約するためにアプリケーションの状態に関する情報が含まれていませんが、赤い線が唯一の子コンポーネント名にある（フィルター、名前、ID、カウント）

var App = React.createClass({ 
 
    render: function() { 
 
    render (
 
     <FilterItem 
 
     filter={this.state.artifactFilter} 
 
     count={this.state.count} 
 
     id={this.state.id} 
 
     name={this.state.name} 
 
     /> 
 
    ) 
 
    } 
 
}); 
 
var FilterItem = React.createClass({ 
 
    render: function() { 
 
    return (
 
     <span>{this.props.name} ({this.props.count})</span> 
 
) 
 
} 
 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.8/react.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.8/react-dom.min.js"></script>

Answer 1

署名React.createClassためのものです：

function createClass<P, S>(spec: ComponentSpec<P, S>): ClassicComponentClass<P>; 

ジェネリックPとS小道具や状態を定義します。
コンパイラはそれらの型が何であるかを知らないため、エラーになった型の基数を使用します。

あなたは行うことができます。

interface AppState { 
    filter: string; 
    count: number; 
    id: string; 
    name: string; 
} 
var App = React.createClass<{}, AppState>(...); 

interface FilterItemProps { 
    count: number; 
    name: string; 
} 
var FilterItem = React.createClass<FilterItemProps, {}>(...); 

を使用すると、クラスの使用している場合：そんなに

class App extends React.Component<{}, AppState> { 
    render() { 
     ... 
    } 
}