[Vuejs]-Vue fade transition on timeout function

by

0👍

It is not easy to tell from your code, but my best guess is that you didn’t implement the CSS to actually create the transition. For example something like this (from docs):

.fade-enter-active, .fade-leave-active {
  transition: opacity 5s;
}
.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
  opacity: 0;
}

If you add the CSS it should work exactly as you describe. More info here: https://v2.vuejs.org/v2/guide/transitions.html

Also, don’t you mean this?

methods: {
    updateTitle() {
        this.title = this.posts[this.currentIndex++].title
        this.currentIndex %= this.posts.length
    }
},
created() {
  setTimeout(() => {
    this.updateTitle()
    setInterval(() => {
        this.updateTitle()
    }, 3000)
  }, 5000)
}
👤Imre_G

Leave a comment