title: How to pass a function as an argument to a ReactJS component in TypeScript
body: <p>I am trying to make a reusable ReactJS button component and need help on how to 
  pass a function to a component and then use it as a click event.  The click event on the button is not working.</p>
  
  <p>Here is the code that will call the component:</p>
  
  <pre><code>export var MyPublicFunction = function (inArg: number) {
      alert(inArg);
  }
  
  ReactDOM.render(&lt;MyButton name="My Button" clickFunction={MyPublicFunction(1)} &gt;Button&lt;/MyButton&gt;, document.getElementById('content'));
  </code></pre>
  
  <p>Here it the component I'm trying to write:</p>
  
  <pre><code>interface myProps {
     name: string;
     clickFunction: any
  }
  
  class MyButton extends React.Component&lt;myProps, {}&gt; {
  
      constructor(props: myProps) {
          super(props);
      }
  
      render() {
          return (&lt;div&gt;
              &lt;button ref="btn1"  onClick={this.props.clickFunction} &gt;
                  {this.props.name}
               &lt;/button&gt;
          &lt;/div&gt;);
      } //end render.
  } //end class.
  </code></pre>