Vue では、`setInterval` 関数を使用してメソッドを定期的に呼び出すことができます。簡単な例を次に示します。
<template>
<div>
<h1>{
{ counter }}</h1>
</div>
</template>
<script>
export default {
data() {
return {
counter: 0
};
},
mounted() {
setInterval(this.incrementCounter, 1000); // 每1000毫秒(即1秒)调用incrementCounter方法
},
methods: {
incrementCounter() {
this.counter++;
}
}
};
</script>
上の例では、コンポーネントがマウントされた後に `mounted` フック関数を使用して `setInterval` 関数を呼び出しました。`setInterval` 関数は時々 `incrementCounter` メソッドを呼び出します。ここでは 1 秒ごとに設定されています。
`incrementCounter` メソッドは、`counter` の値を 1 ずつインクリメントします。このメソッドが呼び出されるたびに、Vue はテンプレートの `counter` にバインドされたテキスト コンテンツを自動的に更新します。このようにして、「counter」の値を随時更新することで定期呼び出し方式を実現します。
役に立ったら「いいね!」して、良い習慣を身につけてください!
質問、交換、激励などメッセージを残してください!