[vue] implement polling

After reading this article, if you feel that you have gained something, if you think it’s okay, please like it and save it.

Goal: The interface is called every 10 seconds, so the front end also needs to be called every 10 seconds

<script>
import { GetMsgNum } from "@/api/system";
export default {
  data() {
    return {
      value: null, //消息
      timer: null, //定时器
    };
  },
  // 轮询-
  destroyed() {
    //离开页面是销毁
    clearInterval(this.timer);
    this.timer = null;
  },
  created() {
    this.GetMsgNum();//初始化

    // 实现轮询
    this.timer = window.setInterval(() => {
      setTimeout(this.GetMsgNum(), 0);
    }, 10000);
  },
  methods: {
    // 轮询-------------
    GetMsgNum() {
      GetMsgNum({ userid: this.userid }).then((res) => {
        this.value = res.data;
        // console.log(res);
      });
    },
    stop() {
      clearInterval(this.timer);
      this.timer = null;
    },
    // 轮询结束-------------
  },
};
</script>