Лучшие практики

Работа с фокусом

Один из вариантов работы с фокусом полей - это компонент обёртка

<script lang="ts">
import { ValidationField } from 'vue-validate-form';

export default {
  name: 'BaseValidationField',
  components: { ValidationField },
  props: {
    name: ValidationField.props.name,
  },
  methods: {
    handleFocus() {
      this.$nextTick(() => {
        this.$el.querySelector(`[name="${this.name}"]`)?.focus();
      });
    },
  },
};
</script>

<template>
  <ValidationField
    :name="name"
    @should-focus="handleFocus"
  >
    <template #default="scopedProps">
      <slot v-bind="scopedProps" />
    </template>
  </ValidationField>
</template>

WARNING

Такой вариант фокуса будет работать только при учёте, что на нужный элемент будет установлен атрибут name