x초마다 메서드/함수를 트리거하는 Vue js

x초마다 메서드/함수를 트리거하는 Vue js

제목으로 거의 설명이 되지만, 매초 함수의 발화를 기대하고 있습니다.

난 아무것도 시도하지 않았고 도움이 될만한 코드도 별로 없어.

나는 구글 검색을 좀 해봤고 지금까지 어떤 예도 즐기지 않았다.

또한, 저는 라라벨 5.6을 사용하고 있습니다.

countDown() 메서드를 호출할 경우 이 기능은 작동하지 않습니다.

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

위에 게시된 답변은 매초 ($nextTick 때문에) 트리거되므로 다른 간격을 설정할 경우 $nextTick을 삭제하기만 하면 됩니다(저의 경우 30초마다 실행해야 하므로 30000으로 설정했습니다).

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

감사합니다, 저는 해결책을 찾았습니다.구글에서 올바른 질문을 조금 해봤습니다.

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

(편집할 수 없기 때문에) 솔루션을 조합하는 것만으로, 이하의 코드가 동작합니다.하나는 뷰가 파괴되면 작업도 정지하고 싶기 때문에, 그 시점에서 클리어 하고 싶은 것입니다.beforeDestroy후크라고 불립니다.

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

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

beforeDestroy() {
  clearInterval(this.timer)
}

이것 좀 봐.난 이게 좋아.

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

이 방법은 데이터에 아무것도 정의하지 않고 컴포넌트가 파기되기 전에 간격이 클리어되도록 하기 때문에 가장 효과적입니다.

created: function() {
  const timer = setInterval(() => {
    this.countDown();
  }, 1000);

  this.$once("hook:beforeDestroy", () => {
    clearInterval(timer);
  });
} 

언급URL : https://stackoverflow.com/questions/49849376/vue-js-triggering-a-method-function-every-x-seconds