Comment utiliser la minuterie dans vue.js

Comment utiliser les timers dans vue.js : 1. Utilisez une boucle pour exécuter setInterval. Cette méthode sera exécutée à chaque fois jusqu'à ce que le timer soit détruit. 2. Exécutez setTimeout régulièrement et setTimeout. une heure et ne l'exécutez qu'une seule fois lorsque le temps d'attente est atteint.

[Articles connexes recommandés : vue.js]

Utilisé dans vue.js Méthodes de minuterie :

1. Exécution de boucle (setInterval)

Comme son nom l'indique, l'exécution de boucle consiste à définir un intervalle de temps, qui sera exécuté chaque time Cette méthode, jusqu'à ce que le timer soit détruit

L'utilisation est setInterval ("nom de la méthode ou méthode", "delay"), le premier paramètre est le nom de la méthode ou la méthode, veillez à ne pas l'utiliser quand il est le nom de la méthode Ajouter des parenthèses, le deuxième paramètre est l'intervalle de temps

<template>
  <section>
    <h1>hello world~</h1>
  </section>
</template>
<script>
  export default {
    data() {
      return {
        timer: &#39;&#39;,
        value: 0
      };
    },
    methods: {
      get() {
        this.value ++;
        console.log(this.value);
      }
    },
    mounted() {
      this.timer = setInterval(this.get, 1000);
    },
    beforeDestroy() {
      clearInterval(this.timer);
    }
  };
</script>

L'exemple ci-dessus consiste à créer un timer setInterval lorsque la page est initialisée, l'intervalle de temps est 1 seconde, chaque seconde La fonction get sera appelée une fois, augmentant ainsi la valeur de value de un.

2. Exécution planifiée (setTimeout)

L'exécution planifiée setTimeout consiste à définir une heure Lorsque le temps d'attente est atteint, il ne sera exécuté qu'une seule fois, mais le. le timer sera toujours là après l'exécution, mais ne fonctionnera pas

L'utilisation est setTimeout("method name or method", "delay"); parenthèses quand il s'agit du nom de la méthode, le deuxième paramètre Le paramètre est l'intervalle de temps

<template>
  <section>
    <h1>hello world~</h1>
  </section>
</template>
<script>
  export default {
    data() {
      return {
        timer: &#39;&#39;,
        value: 0
      };
    },
    methods: {
      get() {
        this.value ++;
        console.log(this.value);
      }
    },
    mounted() {
      this.timer = setTimeout(this.get, 1000);
    },
    beforeDestroy() {
      clearTimeout(this.timer);
    }
  };
</script>

Ce qui précède consiste à créer un timer setTimeout lorsque la page est initialisée, et à l'exécuter uniquement la méthode une fois après 1 seconde.

Recommandations d'apprentissage gratuites associées : JavaScript (vidéo)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!