Как на vue js сымитировать клик?

Question

[nastya_zholudeva]

есть jQuery событие $("#users_area_link").click();, которое имитирует клик мыши. Как такое же сделать на Vue js

Answer 1

[0xD34F]

Так:

methods: {
  onClick1() {
    alert('button1 clicked');
  },
  onClick2() {
    this.$refs.button.click();
  },
},

<button @click="onClick1" ref="button">button1: click me</button>
<button @click="onClick2">button2: click button1</button>

??

Comments

[nastya_zholudeva]

0xD34F, именно так мне и нужно, но у меня выскакивает ошибка

TypeError: _this3.$refs.button.click is not a function

Этот код я использую, в responsive axios запроса

[nastya_zholudeva]

0xD34F , вот мой код

<button type="button" class="btn btn-green" @click="getAuth()">войти</button>
 <nuxt-link to="/users_area" ref="button"></nuxt-link>

getAuth() {
            authParams['email'] = this.singLogin;
            authParams['password'] = this.singPassword;

//axios. запрос
            myObject.callApiPost('auth/login', authParams, '').then((res) => {
                this.newToken = res.data;
                document.cookie = 'token=' + this.newToken.data.token;
                this.notAuth = res.data.error;
                this.$root.$emit('isAuth', this.notAuth);

                if (!this.notAuth) {
                    this.$refs.button.click();
                    $('.fancybox-close').click();
                }
            }).catch((error) => {
                alert(error)
                this.errorAuth = true
            });
        },

алерт и ловит ошибку, а в консоли при этом пусто

[nastya_zholudeva]

0xD34F попробовала сделать @click="getAuth($event)"

<button type="button" class="btn btn-green" @click="getAuth($event)">войти</button>
 <nuxt-link to="/users_area" ref="button"></nuxt-link>

getAuth() {
let $this = $(e.target);
            authParams['email'] = this.singLogin;
            authParams['password'] = this.singPassword;

//axios. запрос
            myObject.callApiPost('auth/login', authParams, '').then((res) => {
                this.newToken = res.data;
                document.cookie = 'token=' + this.newToken.data.token;
                this.notAuth = res.data.error;
                this.$root.$emit('isAuth', this.notAuth);

                if (!this.notAuth) {
                    $this.$refs.button.click();
                    $('.fancybox-close').click();
                }
            }).catch((error) => {
                alert(error)
                this.errorAuth = true
            });
        },

в алерте вылезла другая ошибка

TypeError: Cannot read property 'button' of undefined

[0xD34F]

nastya_zholudeva, а, так вы роут сменить пытаетесь.

Попробуйте так:
this.$router.push(this.$refs.button.to)
Это вместо имитации клика.

[nastya_zholudeva]

0xD34F, спасибо вам большое:) Вы как всегда мне помогли:)

[0xD34F]

nastya_zholudeva, так, просьба на будущее - вы пишите сразу, какую задачу пытаетесь решить. OK?

[nastya_zholudeva]

0xD34F, хорошо:) Спасибо еще раз большое:)

Answer 2

[pantagruel964]

<div @click="method">link</div>

export default {
...
methods: {
    method(e) {
        ....
    }
}
...
}