Vue js triggering a method/function every x seconds

Question

The title pretty much explains it, but i am looking to fire of a function every second.

I haven't tried anything, nor do i have much code that would be useful.

I have done some googling around and so far had n joy with any examples.

Also, i am using laravel 5.6

this doesn't work, for calling the countDown() method

export default {
    ready() {
        window.setInterval(() => {
            this.countDown();
        },1000);
    },

Answer 1

The answer posted above is triggered every second (because of $nextTick) so in case you want to set a different interval, just remove the $nextTick ( In my case I set it to 30000 since I had to fire it every 30 seconds)

mounted: function () {
  window.setInterval(() => {
    this.getNotifications()
  }, 30000)
}

Answer 2

Thanks guys, i found the solution, just took a bit of asking the right questions in google :)

mounted: function () {
        this.$nextTick(function () {
            window.setInterval(() => {
                this.countDown();
            },1000);
        })
    }

Answer 3

Just to combine the solutions (since I'm unable to edit), the code below works. One gotcha is that you also want the job to stop once the view is destroyed, so you'll want to clear it when the beforeDestroy hook is called

mounted: function () {
  this.timer = setInterval(() => {
    this.countDown()
  }, 1000)
},

data() {
  return {
    timer: null
  }
},

beforeDestroy() {
  clearInterval(this.timer)
}

Answer 4

Check this out. This one works for me.

created() {
    this.interval = setInterval(() => this.getNotifications(), 3000);
}