Как отменить пользовательское событие JavaScript в слушателе?

Question

Если отправляется пользовательское событие, созданное с помощью CustomEvent, каков метод его отмены в слушателях для предотвращения основной цели события?

Например, Anпользователь щелкает по оверлею, затем он генерирует событие, но он должен решать, скрывать ли оверлей или оставить его без изменений.

ОБНОВЛЕНИЕ Это поделиться знаниями вопрос, я знаю ответ, но постараюсь передать его другим.

Answer 1

Нам нужно настроить событие как cancellable

// create an event
let awesomeEvent = new CustomEvent('some_awesome_event', {
    cancelable: true
})
// emit
let isAllowed = window.dispatchEvent(awesomeEvent)

Вызвать preventDefault внутри любого прослушивателя событий, чтобы отменить его.

window.addEventListener('some_awesome_event', event => {
    event.preventDefault()
})

Затем можно проверить,событие было отменено с результатом, возвращенным из dispatchEvent

let isAllowed = window.dispatchEvent(awesomeEvent)
if(isAllowed){
    // do some default things
}
else {
    // just an example
    console.log('Oops! The event was cancelled, nothing to do...')
}

руководство MDN для создания и запуска событий

protectDefault документация

отменяемый интерфейсная документация