<h3 dir="auto">Problem description</h3>
<p dir="auto">I simply have  this code:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="handleExpandChange = (expanded) =&gt; {
        this.setState({expanded: expanded});
    };

    handleToggle = () =&gt; {
        this.setState({expanded: !this.state.expanded});
    };

    render() {
        return (
            &lt;div&gt;
                &lt;Card expanded={this.state.expanded} onExpandChange={this.handleExpandChange}&gt;
                    &lt;CardHeader
                        title=&quot;URL Avatar&quot;
                        subtitle=&quot;Subtitle&quot;
                        avatar=&quot;images/ok-128.jpg&quot;
                    /&gt;

                    &lt;CardText expandable={true}&gt;
                        &lt;h4&gt;zxczxc&lt;/h4&gt;
                    &lt;/CardText&gt;

                    &lt;CardActions&gt;
                        &lt;FlatButton label=&quot;Expand&quot; onTouchTap={this.handleToggle} /&gt;
                        &lt;FlatButton label=&quot;Reduce&quot; onTouchTap={this.handleToggle} /&gt;
                    &lt;/CardActions&gt;
                &lt;/Card&gt;

            &lt;/div&gt;
        );
    }"><pre class="notranslate"><code class="notranslate">handleExpandChange = (expanded) =&gt; {
        this.setState({expanded: expanded});
    };

    handleToggle = () =&gt; {
        this.setState({expanded: !this.state.expanded});
    };

    render() {
        return (
            &lt;div&gt;
                &lt;Card expanded={this.state.expanded} onExpandChange={this.handleExpandChange}&gt;
                    &lt;CardHeader
                        title="URL Avatar"
                        subtitle="Subtitle"
                        avatar="images/ok-128.jpg"
                    /&gt;

                    &lt;CardText expandable={true}&gt;
                        &lt;h4&gt;zxczxc&lt;/h4&gt;
                    &lt;/CardText&gt;

                    &lt;CardActions&gt;
                        &lt;FlatButton label="Expand" onTouchTap={this.handleToggle} /&gt;
                        &lt;FlatButton label="Reduce" onTouchTap={this.handleToggle} /&gt;
                    &lt;/CardActions&gt;
                &lt;/Card&gt;

            &lt;/div&gt;
        );
    }
</code></pre></div>
<p dir="auto">I can't get the controlled card working like example. Is this anything issue with React 15,6.1?</p>
<p dir="auto">I read <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="235851909" data-permission-text="Title is private" data-url="https://github.com/mui/material-ui/issues/7129" data-hovercard-type="issue" data-hovercard-url="/mui/material-ui/issues/7129/hovercard" href="https://github.com/mui/material-ui/issues/7129">#7129</a> there is an issue with the touch event. Is this any impact with the card components?</p>
<p dir="auto">I've tried change FlatButton to use regular button and use onClick still not working.</p>
<h3 dir="auto">Versions</h3>
<ul dir="auto">
<li>Material-UI: 0.18.1</li>
<li>React: 15,6,1</li>
<li>Browser: Chrome</li>
</ul>
<p dir="auto">The onTouchTap from Buttons isn't working with React 15.6.0 <a href="https://facebook.github.io/react/warnings/unknown-prop.html" rel="nofollow">https://facebook.github.io/react/warnings/unknown-prop.html</a><br>
I think it's finally time to move to the standard onClick and remove tap event plugin</p>