v-on: нажмите не работающую кнопку при нажатии на ее содержимое в bootstrap - vue - PullRequest
Новая
       19

v-on: нажмите не работающую кнопку при нажатии на ее содержимое в bootstrap - vue

0 голосов
/ 20 марта 2020

Я создал в своем компоненте vue следующий шаблон 

                <b-button v-on:click="check($event)" class="btn btn-success" data-action="consent">
                    <b-icon-check></b-icon-check>
                </b-button>

Однако событие нажатия, похоже, работает, только если я нажимаю на саму кнопку, например по сторонам вокруг значка, и не при нажатии на сам значок.

Мне интересно, есть ли лучший способ сделать то, что я хочу достичь, вместо добавления другого v-on: нажмите на сам значок.

По сути, я хочу, чтобы кнопка вызывала событие щелчка, даже если щелкнул любой его элемент.

enter image description here

Вот функция проверки (событие) 

    methods:{
        check(event){
            let action = event.target.getAttribute('data-action');
            if(action === 'consent'){
                this.checked = true;
            }
            else{
                this.checked = false;
            }
        }
    },

После прочтения комментариев и ссылки на модификаторы, я думаю, что мой ошибка в том, что event.target будет кнопкой. Вместо этого это сам значок, поэтому мой код не работает.

1 Ответ

2 голосов
/ 20 марта 2020

Используйте event.currentTarget.getAttribute('data-action'), чтобы получить атрибут data*, с которого связан прослушиватель событий. event.currentTarget всегда будет элементом, с которым связан слушатель события (а не элементом, который фактически инициировал событие click, на что указывает event.target).

...