43 lines
944 B
JavaScript
43 lines
944 B
JavaScript
import React from 'react';
|
|
import 'bootstrap/dist/css/bootstrap.css';
|
|
import './Li.css';
|
|
|
|
class Li extends React.Component {
|
|
constructor(props){
|
|
super(props)
|
|
console.log(this.props);
|
|
this.markedFlag = false;
|
|
this.state = {
|
|
cssClass: 'unMarked'
|
|
}
|
|
}
|
|
|
|
render(){
|
|
return (
|
|
<div>
|
|
<li className={this.state.cssClass}>
|
|
<div className="form-check">
|
|
<label className="form-check-label">
|
|
<input className="checkbox" type="checkbox" onClick={this.mark} />
|
|
{this.props.todo} At {this.props.at}
|
|
<i className="input-helper"></i>
|
|
</label>
|
|
</div>
|
|
</li>
|
|
</div>
|
|
)
|
|
}
|
|
mark = () => {
|
|
if (this.markedFlag) {
|
|
this.markedFlag = false;
|
|
this.setState({cssClass:'unmarked'})
|
|
}else{
|
|
this.markedFlag = true;
|
|
this.setState({cssClass:'marked'})
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
export default Li
|