After implementing the mounted() function, the animation now successfully plays when the page is updated. However, there seems to be an issue as the animation does not trigger when clicked.
Even though console.log registers a click event, the animation fails to play. Where could I have gone wrong?
<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>