Vueメソッドに基づくシンプルなタイマーの実装
|
Vueのシンプルなタイマーを参考にしてください。具体的な内容は以下のとおりです 原理: setInterval は、1 秒 (設定可能な時間間隔) ごとに自己増分メソッドを実行するために使用され、clearInterval は、タイマーの機能を実現するために継続的に実行される自己増分メソッドを停止するために使用されます。 Vue部分では、Vueのリアルタイムリフレッシュビュー機能を利用して、自動インクリメント変数の値をフロントエンドに表示します。
<!DOCTYPE html>
<html>
<ヘッド>
<メタ文字セット="utf-8">
<title>時間</title>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
</head>
<本文>
<div id="アプリ">
<input type="button" name="" id="" value="開始" @click="開始"/></br>
<h1>{{番号}}</h1>
<input type="button" name="" id="" value="一時停止" @click="停止"/></br>
</div>
<script type="text/javascript">
var vm = 新しい Vue({
el:"#アプリ",
データ：{
番号:0
},
方法:{
開始:関数(){
時間 = setInterval(関数(){
vm.number++
},1000)
},
停止:関数(){
クリア間隔(時間)
}
}
})
</スクリプト>
</本文>
</html>レンダリング
以上がこの記事の全内容です。皆様の勉強のお役に立てれば幸いです。また、123WORDPRESS.COM を応援していただければ幸いです。 以下もご興味があるかもしれません:
|
<<: MySQL デュアルマシン ホットスタンバイ実装ソリューション [テスト可能]
>>: Linux運用保守ツールSupervisor（プロセス管理ツール）のインストールと使用
推薦する
Linux のさまざまなロックメカニズムの使用方法と違いについて詳しく説明します
序文：この知識を理解する必要がある人は、すでにプロセス間通信とスレッド間通信の基本的な理解を持ってい...
ウェブサイトのカラースキーム ウェブサイトに適した色の選択
色はウェブサイト訪問者に影響を与えますか?数年前までは、ウェブサイトはまだ贅沢品でしたが、今ではほと...
MySQLトリガーの使用と注意すべき点
目次トリガーについてトリガーの使用トリガーを作成するトリガーを表示トリガーの削除使用上の注意新旧の違...
axiosリクエストをvueでカプセル化する方法
実際、Vueでaxiosをカプセル化するのは非常に簡単ですまず、srcパスにhttpフォルダを作成し...
MySQL サーバーの接続、切断、および cmd 操作
mysql コマンドを使用して MySQL サーバーに接続します。 MySQL サーバーが起動したら...
写真のプレビューとアップロード機能を実現するhtml+css+js
はじめに: Web ページを作成するときに、画像をアップロードする必要がある場合がよくあります。画像...
ネイティブ js で呼び出し、適用、バインドを実装する方法
1. 呼び出しを実装するステップ：関数をオブジェクトのプロパティとして設定します。これを関数に割り当...
Docker で php-nginx-alpine イメージをゼロから構築する方法
これまでにも Docker 環境でいくつかのプロジェクトを実行したことはありますが、まだイメージをよ...
Vueはテーブルページング機能を実装します
この記事では、テーブルページング機能を実現するためのVueの具体的なコードを例として紹介します。具体...
CSS でレスポンシブ レイアウトを実装する方法
CSS でレスポンシブ レイアウトを実装するレスポンシブレイアウトは非常にハイエンドで難しいように思...
CSS3 でクールなスライス画像カルーセル効果を実現
今日は、CSS を使用してクールな画像カルーセル コンポーネントを作成する方法を学びます。その原理は...
HTML ではスペースはどのように表現されますか (どのような意味ですか)?
Web 開発では、次のような文字によく遭遇します: これは実際には HTML が...
WeChatアプレットで画像の幅と高さを取得する方法
起源最近、私は要件 A に取り組んでいます。そこには、次のように記述される小さな機能ポイントがありま...
Samba を使用して Linux サーバー上で共有ファイル サービスを構築する方法
最近、私たちの小さなチームは、サーバー上の共有フォルダーを共有して、全員がパブリックリソースドキュメ...
MySQL データベース内の varchar 型の数値のサイズを比較する方法
テストテーブルを作成する -- ---------------------------- -- ch...