Controlled Components

[sebastian-ludwig]

I am coming from MaterialUI and so I am used to the controlled component "pattern" (https://mui.com/material-ui/guides/api/#controlled-components).

When using Vuetify, I can see that visual component state changes even when not using v-model-binding.
For example for v-switch: https://codepen.io/seb-lu/pen/wvPVYqe?editors=1011
I would expect that the control only changes state when input-value changes to make sure we are always in sync.

This can also been seen in other components (like v-list-group: https://codepen.io/seb-lu/pen/eYyqwNg?editors=1011).
Here I would like the component to only interpret the value and do not any magic in the background.
It even get's more confusing when setting the value to "Target 2" via the button (works on the first run, but not after having toggled "Target 2").

For me (coming from MaterialUI) this feels like a bug, but maybe you can enlighten me, why Vuetify handles it that way and if there are any workarounds for those two use-cases. Thank you very much in advance.

[KaelWD]

This works the way you expect in v3.

[sebastian-ludwig]

Thanks. Great, looking forward using it, when our Application is Vue3 ready