Typescript React。オブジェクトを破棄して広げる

Question

子コンポーネントをステートレス（機能コンポーネント）に保とうとしています。だから、子コンポーネントにルートコンポーネントの状態値を割り当てる便利な方法を探しています。

interface IState { 
    a: string; 
    b: number; 
    c: (e) => void; 
} 

が、その後

<ChildA {...this.state as { a: string, c }} /> 
<ChildB {...this.state as { c: (e) => void, b }} /> 

は残念ながら活字が現在速記プロパティ名をサポートしていない、と言います。どのエレガントなアプローチがありますか？

Answer 1

最新のタイスクリプト版では、子コンポーネントの適切な小道具タイプを持っている限り、キャストする必要なしに上記のようにスプレッド演算子を使用できます。子ステートレスなコンポーネントの使用を定義するには

interface ChildAProps { 
    a: string; 
    c: (e) => void; 
} 

：ChildAコンポーネントのような小道具を持っていると仮定すると、

const ChildA : React.SFC<ChildAProps> = props => 
    <div>{this.props.a}</div> 

React.SFCはReact.StatelessComponentクラスの別名です。そして、後で状態を持つ親コンポーネント内のChildAのインスタンスを使用するには、単に：

<ChildA {...this.state} />