Skip to content

Commit

Permalink
update
Browse files Browse the repository at this point in the history
  • Loading branch information
dycor committed Jun 7, 2019
1 parent 10ea427 commit 840c515
Show file tree
Hide file tree
Showing 2 changed files with 34 additions and 2 deletions.
14 changes: 14 additions & 0 deletions client/src/components/ToDoItem.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
import React from 'react';

class ToDoItem extends React.Component{
render(){
return <li style={{
opacity: this.props.todo.completed ? 0.5 : 1,
backgroundColor: 'red'
}} onClick={ () => this.props.onComplete(this.props.todo)}>
{this.props.todo.text};
</li>
}
}

export default ToDoItem;
22 changes: 20 additions & 2 deletions client/src/components/ToDoList.js
Original file line number Diff line number Diff line change
@@ -1,11 +1,29 @@
import React from 'react';
import ToDoItem from "./ToDoItem";

class ToDoList extends React.Component{
state = {
todos : [
{text : "test" , completed : true},
{text : "test2"}
]
};

handleComplete = todo => {

this.setState({
todos : this.state.todos.map(item => {
if(item.text === todo.text) item.completed = !item.completed
return item;
})
})
};

render(){
const todos = [{text: "test"},{text :"test2"}];
const { todos } = this.state;
return <ul>
{
todos.map(item => <li> {item.text}</li>)
todos.map(item => <ToDoItem key={item.text} todo={item} onComplete={this.handleComplete}/>)
}
</ul>
}
Expand Down

0 comments on commit 840c515

Please sign in to comment.