scrimba
Learn React
React Todo App: Phase 7
Go Pro!Bootcamp

Bootcamp

Study group

Collaborate with peers in your dedicated #study-group channel.

Code reviews

Submit projects for review using the /review command in your #code-reviews channel

React Todo App: Phase 7
AboutCommentsNotes
React Todo App: Phase 7
Expand for more info
TodoItem.js
run
preview
console
/**
* Challenge: Style the completed todo items differently from the incomplete items.
*/

import React from "react"

function TodoItem(props) {
return (
<div className="todo-item">
<input
type="checkbox"
checked={props.item.completed}
onChange={() => props.handleChange(props.item.id)}
/>
<p>{props.item.text}</p>
</div>
)
}

export default TodoItem
Console
index.html
-2:30