Блог

По какой-то причине этот код работает:

 const Task = ({task, onDelete, onToggle}) =gt; {  return (  lt;div className="task"   onClick={() =gt; onToggle(task.id)}gt;   lt;/divgt;  

Но это не так:

 const Task = ({task, onDelete, onToggle}) =gt; {  return (  lt;div className="task"   onDoubleClick={() =gt; onToggle(task.id)}gt;   lt;/divgt;  

Остальная часть кода такова, если это поможет:

App.js

 const toggleReminder = (id) =gt; {  console.log("double click!", id);  }   return (  lt;div className="container"gt;  lt;Header title="Task Tracker"/gt;  {tasks.length gt; 0 ? (  lt;Tasks tasks={tasks} onDelete={deleteTask} onToggle={toggleReminder}/gt;  ) : ("No Tasks to show")  }  

Tasks.js

 const Tasks = ({ tasks, onDelete, onToggle }) =gt; {  return (  lt;gt;  {tasks.map((task, index) =gt; (  lt;Task key={index} task={task} onDelete={onDelete} onToggle={onToggle} /gt;  ))}  lt;/gt;  ) }  

И Task.js

 const Task = ({task, onDelete, onToggle}) =gt; {  return (  lt;div className="task"   onDoubleClick={() =gt; onToggle(task.id)}gt;   lt;h3gt;{task.text}   lt;FaTimes  style={{color:"red", cursor: 'pointer'}}   onClick={()=gt; onDelete(task.id)}/gt;  lt;/h3gt;  lt;pgt;{task.day}lt;/pgt;  lt;/divgt;   )  }  

Я копировал все из учебника, и я действительно не понимаю проблемы. С onClick это работает просто отлично. Работают ли они по-другому? Я видел аналогичный вопрос, но не понял ответа Спасибо!