How to pass a function as an argument to a ReactJS component in TypeScript
<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>