Используя touchstart и / или щелкните (mousedown) Angular 6
Проблема:
У меня проблема, когда во всем приложении используется событие щелчка. Приложение будет использоваться как на мобильных устройствах, так и в Интернете. Я использую Angular 6.
Каждый раз, когда вы нажимаете кнопку или ссылку в браузере на моем рабочем столе, он срабатывает при первом щелчке, но на мобильных устройствах щелчок иногда не работает. поправьте меня, если я ошибаюсь, но я считаю, что люди называют это призрачным щелчком.
Я думал, что это задержка в 300 мс, но я попытался использовать кран hammerjs и вместо этого попробовал fastclick, и, похоже, это не проблема.
Я пробовал использовать touchstart в html вместо щелчка / касания и, похоже, избавился от проблемы.
Есть ли способ связать mousedown и touchstart друг с другом?
есть ли способ использовать просто щелчок / мышку на рабочем столе и сенсорный запуск на мобильном телефоне?
Как еще я могу это исправить?
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 3
Если вы используете Angular 6, по умолчанию он внутренне использует библиотеку hammerjs для обработки событий жестов касания. Также он удаляет задержку в 300 мс для двойного нажатия. Вот URL-адрес, который объясняет больше о Touch Gesture в Angular. https://blog.angularindepth.com/gestures-in-an-angular-application-dde71804c0d0
вы должны использовать (щелкнуть), который будет работать как для настольных компьютеров, так и для мобильных
(щелкните) и (коснитесь), похоже, работают одинаково, почти все приложение создается с помощью (щелкните), но проблема в том, что (щелчок) кажется медленнее и тоже не отвечает. (touchstart) - единственный, который, кажется, быстро реагирует, но мне нужно, чтобы он работал и на рабочем столе.
вы используете ионный?
Я не использую ионный
@Seth вы устранили проблему ... мы также сталкиваемся с той же проблемой.
Попробуйте в своем шаблоне:
<div
(touchmove) = "touchMoving($event)"
(touchstart) = "touchStart($event)"
(touchend) = "touchEnd($event)"
>
В вашем компоненте теперь вы можете использовать данные $ event:
touchMoving($event) {
console.info($event);
}
Я обнаружил, что вы должны ВСЕГДА использовать (mousedown) вместо (щелкать) для кнопок в Angular, если это мобильное приложение. При щелчке событие иногда не регистрируется из-за проблем с DOM. Для лучшей производительности просто используйте mousedown.
Я ценю ответ. В настоящее время я использую тап в hammerjs, и это, похоже, не исправляет медленный отклик кнопки на мобильном телефоне, и иногда вам нужно дважды нажать его, чтобы он зарегистрировался.