vuetify icon indicating copy to clipboard operation
vuetify copied to clipboard

[Bug Report][3.0.0] VSwitch only outputs every second toggle

Open tve opened this issue 3 years ago • 2 comments

Environment

Vuetify Version: 3.0.0-beta.8 Vue Version: 3.2.36 Browsers: Chrome 102.0.5005.149 OS: Linux x86_64

Steps to reproduce

  • open the codepen
  • click on the switch, observe the brief "ON" label to indicate output event
  • observe that the switch hasn't toggled due to disconnect between output event and modelValue prop
  • click on the switch again, observe that no output event is produced (the label doesn't flash "ON")
  • click on the switch more often and observe that only every second click results in an event

Expected Behavior

I expected an output even on every click

Actual Behavior

Only every second click produces an output event

Reproduction Link

https://codepen.io/codesurfr/pen/NWYJyPV

Other comments

The intent here is to process and validate the switch output before feeding it back such that the switch only toggles visually IF the action it is intended to cause actually took place. I.e., if the user clicks the switch and the external action doesn't occur, then the switch doesn't change position.

tve avatar Aug 22 '22 16:08 tve

This could be a bit tricky, since vue does not support controlled inputs the same way react does. https://github.com/vuejs/core/issues/6084

Since our v-switch is backed by an <input>, it gets checked even though the model hasn't changed.

nekosaur avatar Aug 23 '22 21:08 nekosaur

I updated the codepen to the 3.0.0 release, problem still exists.

tve avatar Nov 01 '22 16:11 tve

You can't use @update:modelValue and not update the model https://codepen.io/johnjleider/pen/rNZRmZg

If you have any questions, please reach out to us in our Discord community.

johnleider avatar Mar 27 '23 20:03 johnleider