Как в vuetify сделать сообщение об ошибке кликабельным?

Question

[Anton8989]

Доброго времени суток, подскажите пожалуйста есть ли возможность сделать так чтобы при клике на сообщение об ошибке отрабатывал какой-либо метод. Есть форма, при вводе некорректных данных отрабатывает валидация (возникает сообщение "Введенные данные не верны") можно это сообщение сделать кликабельным, чтобы при клике можно было запустить какой-нибудь метод.

Answer 1

[0xD34F]

API компонента v-text-field подобной возможности не предоставляет, так что придётся закостылить.

На экземпляр компонента вешаем нативный обработчик клика, внутри проверяем, откуда пришло событие:

<v-text-field @click.native="onClick">

methods: {
  onClick({ target: t }) {
    if (
      t.classList.contains('v-messages__message') &&
      t.closest('.v-messages.error--text')
    ) {
      // ну да, кликнули по сообщению об ошибке
    }
  },
},

https://jsfiddle.net/92xcLg0y/

Answer 2

[Дмитрий Кузнецов]

Если вы не используете какие-либо фреймворки (по визуалу), то думаю да.

У вас должно быть некий div (span или ещё что-то типо того), куда помещается ошибка. На этот div вешается обработчик @click (точно не помню как в VueJS) и вызывается нужный метод.

Comments

[Anton8989]

Сори, не указал, что я использую Vuetify