В HTML принято использовать строчные буквы для названий событий:
<button onclick='activateLasers()'>
React использует camelCase для названий событий:
<button onClick={activateLasers}>
В HTML ты должен явно вызвать функцию, добавив скобки ():
<button onclick='activateLasers()'>
В React ты передаёшь ссылку на функцию без скобок:
<button onClick={activateLasers}>
Если добавишь () в React, функция выполнится сразу при рендере, вместо того чтобы ждать клика.
В HTML ты можешь вернуть false, чтобы предотвратить стандартное поведение:
<a href='#' onclick='console.log("Link clicked"); return false;' />
В React ты должен явно вызвать метод preventDefault() на объекте события:
function handleClick(event) {
event.preventDefault()
console.log('Link clicked')
}
Основные отличия:
onClick, onChange)())event.preventDefault() вместо return false, чтобы предотвратить стандартное поведениеЭти различия отражают синтетическую систему событий React и обеспечивают более явную и предсказуемую обработку событий по сравнению с традиционными встроенными событиями HTML.
В React передача ссылки на функцию без скобок в обработчик события предотвращает немедленное выполнение функции на этапе рендеринга.
Новый — ещё не проверен сообществом
Вы