title: How to get children type in react
body: <p>I'm trying to make my own <code>Tabs</code> component, so that I can use tabs in my app. However I seem to be having issues trying to extract the child components I need by type. </p>
  
  <pre><code>import React from 'react'
  
  export class Tabs extends React.Component {
    render() {
      let children = this.props.children
      let tablinks = React.Children.map(children, x =&gt; {
        console.log(x.type.displayName) // Always undefined
        if (x.type.displayName == 'Tab Link') {
          return x
        }
      })
  
      return (
        &lt;div className="tabs"&gt;&lt;/div&gt;
      )
    }
  }
  
  export class TabLink extends React.Component {
    constructor(props) {
      super(props)
      this.displayName = 'Tab Link'
    }
    render() {
      return (
        &lt;div className="tab-link"&gt;&lt;/div&gt;
      )
    }
  }
  </code></pre>
  
  <hr>
  
  <pre><code>&lt;Tabs&gt;
      &lt;TabLink path="tab1"&gt;Test&lt;/TabLink&gt;
      &lt;TabLink path="tab2"&gt;Test2&lt;/TabLink&gt;
  &lt;/Tabs&gt;
  </code></pre>
  
  <p>My <code>console.log</code> never returns "Tab Link", it always returns <code>undefined</code>, why?</p>