Vuetify's autofocus works only on first modal open

Question

I am trying to use Vuetify\'s v-text-field autofocus however it works only first time. After I close the dialog, it doesn\'t work anymore.

Answer 1

In your sandbox (but also seems to be the case in your question) you had an error in your code, you removed return from the provided workaround:

watch: {
  dialog (val) {
    if (!val) return; // you removed `return` here
    requestAnimationFrame(() => {
      return this.$refs.focus.focus();
    }
  });

So actually it works

Answer 2

The only thing that worked for me was the v-if="dialog" because the autofocus prop will only work on initial load which is why it was available only for the first time I opened the dialog.

So the working v-tex-field with autofocus in dialog would look something like this:

<v-text-field label="Label" v-if="dialog" autofocus></v-text-field>