<label class="checkbox-slider">
<input type="checkbox" class="check-input" name="checkbox">
<span class="checkbox-anim"></span>
<span class="checkbox__text">Active</span>
</label>
<div class="checkbox-slider__letter">A</div>
</div>
checkbox-anim — кастомный чекбокс, стили меняются в css.
Сейчас при клике на checkbox-slider__letter всё норм, но клик по самому чекбосу срабатывает дважды.
Если повесить клик на label (именно это и нужно), результат в точности такой же.
Модификатор .stop погоды не делает.
Модификатор .self срабатывает только если под курсором нет остальных элементов а только label-wrapper.
.prevent работает норм, но не меняет состояние чекбокса.
Почти как надо срабатывает только если повесить v-on:click на checkbox-anim, но это игнорирует клик по тексту Active.
Вопрос: почему оно срабатывает дважды и что сделать чтоб этого не было?
не нужно вешать на label или checkbox @click. Работай через v-model
Обсуждают сегодня