import React from 'react';

class TodoItem extends React.Component<any, any> {
    public onClickFn = (ev: any) => {
        const { checked } = ev.target;
        const { index, deleteTodo } = this.props;
        deleteTodo(index, checked);
        // ev.target.checked = false;
    }
    public render() {
        const { done } = this.props.todo;
        const isDone = done ? 'line-through' : 'none';
        // const isDone = done ? 'done' : 'undone';
        return (
            <div className='todoItem'>
                {<input type={`checkbox`} onClick={this.onClickFn} />}
                <span style={{ textDecoration: isDone }}>{this.props.todo.value}</span>
            </div>
        );
    }
}
export default TodoItem;