title: this.props.xxx is undefined while using React with typescript but working properly in ES5?
body: <p>Recently I started learning react with ES5 but now trying to use Type
       script in my app. Can anyone please tell me why I am not able to print
       values using <strong>{this.props.people}</strong> but it is working as expected when i am
       using <strong>{this.state.people}.</strong> I have taken example from this site.
      Please suggest me what is missing here?</p>
  
  <p><a href="http://www.hackingwithreact.com/read/1/13/rendering-an-array-of-data-with-map-and-jsx" rel="nofollow noreferrer">Site</a></p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import * as React from 'react';
  
  class About extends React.Component&lt;any, any&gt; {
      constructor(props: any) {
          super(props);
          console.log(About);
          const people = [];
  
          for (let i = 0; i &lt; 10; i++) {
              people.push({
                  name: i,
                  country: i + i
              });
          }
  
          this.state = {people};
      }
      public render() {
          return (
              &lt;div&gt;
              {this.props.people.map((person: any, index: number) =&gt; (
                  &lt;p key={index}&gt;Hello, {person.name} from {person.country}!&lt;/p&gt;
              ))}
          &lt;/div&gt;
          );
      }
  }
  export default About;</code></pre>
  </div>
  </div>
  </p>