import React,{Component} from 'react';
import ReactDOM from 'react-dom';

import CheckList from './CheckList';

class Card extends Component {
    constructor() {
        super(...arguments);
        this.state = {
            showDetails: false
        };
    }

    render() {
        let cardDetails;
        //showDetails가 true 면 detail 화면을 랜더링 한다.
        if (this.state.showDetails) {
            cardDetails = (
                <div className="card__details">
                    {this.props.description}
                    <CheckList cardId={this.props.id} tasks={this.props.tasks} />
                </div>
            );
        };

        return (
            <div className="card">
                <div className="card__title" onClick={
                    ()=>this.setState({showDetails: !this.state.showDetails})
                }>{this.props.title}</div>
                {cardDetails}
            </div>
        );
    }
}

export default Card;

@@ -257,16 +257,108 @@
 %0A    %7D%0A%0A
+    toggleDetails() %7B%0A        this.setState(%7BshowDetails: !this.state.showDetails%7D);%0A    %7D%0A%0A
     rend
@@ -894,35 +894,42 @@
 : !this.
-state.showDetails%7D)
+toggleDetails.bind(this)%7D%3E
 %0A       
@@ -937,18 +937,20 @@
         
-%7D%3E
+    
 %7Bthis.pr
@@ -959,16 +959,33 @@
 s.title%7D
+%0A                
 %3C/div%3E%0A 

replace toggle event