Почему аниме. js не работает при клике в vuejs? - PullRequest
Новая
       104

Почему аниме. js не работает при клике в vuejs?

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

Теперь, благодаря mount (), анимация успешно работает при обновлении страницы, но по какой-то причине анимация не воспроизводится при нажатии на нее.

console.log выводится по щелчку , но нет анимации. В чем была моя ошибка? 

<template>
  <div class="compHeader">
    <h1 class="testVal" style="position: absolute;">QWERTY</h1>
    <button type="button" class="testClick" @click="testClickGo().restart">+</button>
  </div>
</template>

<script>
  export default {
    methods: {
      testClickGo(){
        console.log(111);
        return this.$anime({
          targets: '.testVal',
          translateX: 200,
          delay: 800
        });
      }
    },
    mounted(){
      this.testClickGo();
    }
  }
</script>

1 Ответ

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

Я нашел ответ на свой вопрос. 

<template>
  <div class="compHeader">
    <h1 ref="animeEl">hello, world!!</h1>
    <button @click="anime.restart()">click me</button>
  </div>
</template>
<script>
data: () => ({
  anime: null,
}),
mounted() {
  this.anime = this.$anime({
    targets: this.$refs.animeEl,
    translateX: 200,
    delay: 800,
  });
}
</script>
...