#javascript #reactjs #onclick #dom-events
#javascript #reactjs #onclick #dom-события
Вопрос:
Проблема в том, что, хотя я прикрепил события (например handleClear
) в классе ниже, однако, когда я проверяю onClick
событие в кнопке dom, вместо этого отображается пустой метод noop() {}
. В результате он не может быть очищен, как ожидалось.
Странно то, что иногда, если я устанавливаю точки останова, метод обработчика будет там. Я подозреваю, что вложение события связано со временем. Но я не могу определить, когда и где он пропускает прикрепление функции события. Кто-нибудь может дать несколько советов по решению этой проблемы? Или предоставить некоторые идеи?
class ClearHistory extends PureComponent {
handleCancel = () => {
console.log('handleCancel');
}
handleClear = (event) => {
console.log('handleClear');
}
render() {
return (
<div>
<Button key='cancel' type='button' onClick={this.handleCancel} >
Cancel
</Button>
<Button key='remove' type='button' onClick={this.handleClear} >
Clear
</Button>
</div>
);
}
}
Ответ №1:
Я создал песочницу для тестирования вашего компонента и переименовал в html-тег, потому что компонент без какой-либо библиотеки пользовательского интерфейса.
https://codesandbox.io/s/clearhistory-fq69b?file=/src/ClearHistory.js
Это работает, но:
Это нормально, потому что сам react заботится о привязке события.
Комментарии:
1. Привет @Daniil, спасибо за создание изолированной среды, а также за прикрепление документа! Это помогает мне понять, почему существует функция noop.
2. Однако по какой-то причине он по-прежнему не работает для меня в моем локальном проекте, где метод очистки истории не выполняется при нажатии. Я попытался проверить свойство react DOM и увидеть, что метод event был назначен событию onclick, но он просто ничего не запускает.
3. @HaoyuChen, проверьте свою консоль на наличие ошибок
4. да, я проверил, но он ничего не регистрирует, когда я нажимаю кнопку. Потому что иногда, когда я устанавливаю точки останова, после щелчка отображается журнал. Мне интересно, могу ли я каким-либо образом узнать, какой код был вызван после нажатия.
5. если вы не видели никаких ошибок и журналов, я думаю, что код не был вызван. Можете ли вы поделиться репозиторием github с проектом? Возможно, проблема в другом.