Skip to main content
Mixin para componentes que precisam reagir a gestos de toque em dispositivos móveis. Registra listeners de touch no elemento raiz e calcula o deslocamento horizontal (touchDelta) entre o início e o fim do toque, útil para implementar comportamentos de swipe.

Uso

import touchableMixin from '@/mixins/touchable';

export default {
    mixins: [touchableMixin],
    mounted() {
        this.bootTouchable(); // necessário chamar manualmente
    },
};

Props injetadas

PropTipoValor padrãoDescrição
useCaptureByEventArray[{ touchstart: false }, ...]Configuração de useCapture por evento de toque.

Data injetada

PropriedadeTipoDescrição
initialClientXNumberPosição X do toque inicial.
finalClientXNumberPosição X do toque final.
touchDeltaNumberDiferença entre initialClientX e finalClientX. Positivo = swipe para esquerda.
touchStartLengthNumberNúmero de pontos de toque no início do gesto.

Métodos injetados

MétodoDescrição
bootTouchableRegistra os event listeners de touch no elemento raiz ($el). Deve ser chamado no mounted.

Eventos emitidos

EventoPayloadDescrição
touchstartTouchEventEmitido ao iniciar o toque.
touchendTouchEventEmitido ao finalizar o toque.
touchcancelTouchEventEmitido quando o toque é cancelado.
touchleaveTouchEventEmitido quando o toque sai do elemento.
touchmoveTouchEventEmitido durante o movimento do toque.