Skip to content

Instantly share code, notes, and snippets.

@webrune-tim
Created January 30, 2017 20:17
Show Gist options
  • Select an option

  • Save webrune-tim/42f3e71d73ef1c5d85be912620de9e65 to your computer and use it in GitHub Desktop.

Select an option

Save webrune-tim/42f3e71d73ef1c5d85be912620de9e65 to your computer and use it in GitHub Desktop.
import React from 'react'
// Flux
import * as TodoActions from '../../actions/TodoActions'
export default class Todo extends React.Component {
constructor(props) {
super(props)
this.handleDeleteTodo = this.handleDeleteTodo.bind(this)
this.handleCompleteToggle = this.handleCompleteToggle.bind(this)
}
render() {
const todo = this.props.todo
let className = ''
if (
( todo.complete && !this.props.showCompletedTodos ) ||
( !todo.complete && !this.props.showIncompletedTodos ) ) {
className = 'todo hide'
} else {
className = 'todo'
}
return (
<div className={className}>
<input type='checkbox' onChange={ this.handleCompleteToggle } />
<div>{todo.text}</div>
<button onClick={ this.handleDeleteTodo }>X</button>
</div>
)
}
handleDeleteTodo() {
TodoActions.deleteTodo(this.props.todo)
}
handleCompleteToggle(e) {
TodoActions.toggleTodo(this.props.todo)
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment