Невозможно удалить событие touchmove - Vue watcher
Функция предотвращения прокрутки на мобильных устройствах:
const hideScroll = function(e) {
e.preventDefault()
}
Добавление слушателя:
document.body.addEventListener('touchmove', hideScroll, { passive: false })
Удаление слушателя:
document.body.removeEventListener('touchmove', hideScroll)
В chrome devtools я ясно вижу, что добавление этого прослушивателя работает, я не могу прокручивать с помощью касания, но когда я запускаю removeEventListener, он не удаляется, я вижу это в chrome dev tools, и я не могу прокручивать с помощью касания. Используя это в наблюдателе Vue:
watch: {
// hidescroll function is here: const hideScroll = function(e) {}
chatWindow(newValue) {
if (newValue) {
// adding listener
} else {
// removing listener
}
}
}
Что такое window в вашем компоненте Vue, и уверены ли вы, что наблюдатель вызывается с ложным значением?
@Seblor, chatWindow - это data() собственность. Когда я нажимаю на кнопку, она переключается на true или false. Я уже пытался поставить console.info() в обоих состояниях - они успешно стреляют.
Вы можете добавить больше своего кода Vue? где вы храните свою функцию hideScroll?
@fila90, обновил ответ, hideScroll действительно стреляет. Но не удаляя слушателя.
@AlexanderKim, но watch - это объект, вы не можете так определить свою функцию? или вы определяете это внутри watch.chatWindow наблюдателя?
@fila90, это объект, верно. Конечно, я могу определить это как метод. Почему ты думаешь, что я не могу?
ну, вы не можете определить это так const hideScroll = function(e) {}, если это метод :D. вы можете скопировать весь свой компонент в jsfiddle или куда-то еще
Отлично работает в этом кодовая ручка (проверено в Chrome 74 на macOS)
@fila90, лол, действительно, я переместил этот const из watch: {}, и теперь он работает, как задумано :D Я написал об этом в своем ответе в качестве комментария: // hidescroll function is here: const hideScroll = function(e) {}
@fila90, ответь, я приму.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
переместите функцию hideScroll из своего наблюдателя.
прямо сейчас вы создаете новую функцию каждый раз, когда срабатывает наблюдатель. функция выглядит так же, но это не тот экземпляр, который прикреплен к прослушивателю событий, и поэтому вы не можете его удалить.
Я только что попробовал его с хромом и «эмулятором» мобильного устройства, и он отлично работает. Добавление слушателя предотвращает прокрутку, удаление его снова заставляет прокрутку работать.