I am a newbie in React and I've been working on a simple To-do list with State Hooks. I am having trouble to assign style= with the function
function Checkbox(){ const [checked, setChecked] = useState(false); return ( <label> <input type="checkbox" checked={checked} onChange={() => setChecked(!checked)} /> </label> ); } in order to complete some tasks. The task should be default "Task" but once checked, I want the task to be crossed out: "T̶a̶s̶k̶". I will post for you my attempt:
import React, {useState} from 'react';
function TodoList({ todo, index, completeTodo, removeTodo}) {
return (
<div className="todo">
<Checkbox />
<div style= >
{todo.text}
</div>
<div>
<button class = "button" onClick={() => removeTodo(index)}>Delete Task</button>
</div>
</div>
);
}
function Checkbox() {
const [checked, setChecked] = useState(false);
return (
<label>
<input type="checkbox"
checked={checked}
onChange={() => setChecked(!checked)}
/>
</label>
);
}
export default TodoList;
Aucun commentaire:
Enregistrer un commentaire