React children issue（typescript）

Question

私は自分の問題に必要なすべてのコードを提供しますが、私はこれを解決する方法については困惑しています。

export class JobBuilderOptimise extends React.Component<JobBuilderOptimiseProps & JobBuilderOptimiseDispatch> { 
    render() { 
     const { 
      jobPosting, 
      search, 
      previewByTemplate 
     } = this.props.pageState; 


     return (

      <div className="optimise-page"> 
       <Row> 
        <Col sm={7} > 
         <div className="optimise-panel"> 
          {this.props.children} 
         </div> 
        </Col> 

        <Col sm={5}> 
         <div className="preview-panel"> 
          <JobPostingControl jobDescription={jobPosting.data} isLoading={search.previewRequestState.isBusy || previewByTemplate.isBusy} leftSide={this.props.children}/> 
         </div> 
        </Col> 
       </Row> 
      </div> 
     ); 
    } 

this.props.childrenには、JobBuilderModel.tsxまたはJobBuilderSearch.tsxが表示されます。

interface JobBuilderModelProps { 
    pageState: BuilderState;  
} 

---

interface JobBuilderSearchProps { 
    pageState: SearchState; 
} 

、また容器のdivのクラス名：

<div className="search-job-section"> 
... 
</div> 

---

neccessary私が見つけることができるメイン識別要因は小道具である場合、私は、それぞれのコードを提供することができます

<div className="model-job-section"> 
... 
</div> 

私がこれらを提供したのは、私が2つの反応成分のうちのどれが表示されるのか把握しなければならない（そして、実際に表示されているものを識別するために2つを区別しようとしているが、それは正しい方法ではないかもしれない）これに基づいて、ページ上にあるJobPostingControlコントロールに文字列を渡す必要があります。詳細が必要な場合はお知らせください。

Answer 1

私が正しく理解していれば、どのタイプのコンポーネントがJobBuilderOptimiseコンポーネントの子の中にあるかを調べる方法が問題です。もしそうなら - 子供のtypeプロパティを使うことができます - それはあなたにそれぞれの子供のタイプを返します。ありがとう

if((child.type as any).prototype instanceof JobBuilderModel) 
{ 

}