Vueの最初のプログラムを書くための勉強ノート
|
ここでは公式ドキュメントCDNを使用します <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script> 1. HTMLを書く、最初のVueプログラム
<!DOCTYPE html>
<html lang="ja">
<ヘッド>
<メタ文字セット="UTF-8">
<title>タイトル</title>
</head>
<本文>
<!--ビュー レイヤー テンプレート-->
<div id="アプリ">
{{メッセージ}}
</div>
<!--vue.js をインポート-->
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
<スクリプト>
var vm = 新しい Vue({
el:"#アプリ",
//モデル: データ:{
メッセージ: "こんにちは、vue"
}
});
</スクリプト>
</本文>
</html>ビューテンプレートとデータに注意してくださいビュー モデル ViewModel: 双方向バインディングとは、フロントエンドのデータが変更されると、データ内のデータも変更されることを意味します。
ページを更新せずにデータを変更し、フロントエンドの表示に同期することができます。
決定ループ
イベント
787 原則Vueを学ぶには、7つのプロパティ、8つのメソッド、7つの命令を知っておく必要があります。 el属性これは、Vue コンパイラーに Vue 構文の解析を開始する場所を指示するために使用され、プレースホルダーとも言えます。 データ属性ビューから抽象化された属性を整理するために使われます。ビューのデータが抽象化されてデータに格納されていると言えます。 テンプレート属性プレースホルダーを含むページ要素を置き換えるテンプレートを設定するために使用されます。 メソッド属性ビジネス ロジックをページ内に配置します。JS メソッドは通常、メソッド内に配置されます。 レンダリングプロパティ本物の仮想DOMを作成する 計算されたプロパティ計算に使用 時計のプロパティ
ウォッチ:関数(新しい関数、古い関数){}
データの変化を監視する 2つのパラメータ、1つは新しい値を返し、もう1つは古い値を返します 以上が勉強ノートvueの最初のプログラムの詳しい内容です。vueプログラムの詳細については、123WORDPRESS.COMの他の関連記事に注目してください！ 以下もご興味があるかもしれません:
|
<<: Ubuntu 20.04 ダブルピンイン入力方式のインストール手順
>>: MySQLとOracleの違いのまとめ（機能性能の比較、選択、使用時のSQLなど）
推薦する
MySQL 起動時に報告される ERROR:2002 の分析と解決方法
序文この記事は主にMySQL起動エラー2002の分析と解決方法を紹介しています。参考と勉強のために共...
JSはショッピングカート内の商品の合計金額の計算を実現します
JSはショッピングカート内の商品の合計金額を計算して参考とします。具体的な内容は以下のとおりです。質...
リモートDockerを使用した統合テスト環境の構築手順
需要背景チームには統合テストが必要であり、そのためには、mysql や rabbitmq などのミド...
JavaScript配列の重複排除のいくつかの方法についての詳細な説明
目次1.重複排除を設定する2. 重複を削除するには、2 回の for ループを使用します。 3. i...
Docker ポート マッピングと外部アクセス不可の問題
Docker コンテナはサービスを提供し、ポート 8888 をリッスンします。外部からアクセスできる...
CentOS7 は Docker のバージョン 19 をデプロイします (簡単なので、従ってください)
1. 依存パッケージをインストールする [root@localhost ~]# yum insta...
MySQL 8.0.20でNavicatをインストールして接続する方法と注意すべき点
注意事項1. まず、mysql インストール ディレクトリに次の内容の my.ini ファイルを作成...
MySQLカスタム関数とストアドプロシージャの詳細な説明
序文この記事では主にMySQLのカスタム関数とストアドプロシージャに関する関連コンテンツを紹介し、皆...
ウェブサイトの画像にグレー効果を加える3つの方法
私はグレースケールの画像の方が芸術的に見えると思うので、いつもグレースケールの画像を好んで使っていま...
Vueはel-tableを使用して列と行を動的に結合します
この記事の例では、el-tableを使用して列と行を動的にマージするVueの具体的なコードを参考まで...
JavaScriptのアロー関数の特徴と通常の関数との違い
目次1. 矢印関数の使用1. 通常関数から矢印関数へ2. 中括弧を省略してリターンする3. 括弧を省...
HTML（divレイヤー）を介してFLASHにリンクを追加するための実装コード
今日、クライアントが広告を掲載したいのですが、提供された素材は Flash です。私たちはあまり気に...
Docker ビルド kubectl イメージ実装手順
プログラムサービスがgitlab ci/cdと統合されたk8sを使用してデプロイされている場合、gi...
CSSは座席選択効果を実現するためにautoflow属性を使用する
1. 自動フロー属性、要素コンテンツの長さと幅が要素自体の長さと幅を超える場合、スクロールバーが表示...
MySQL でストリーミングクエリを使用してデータ OOM を回避する
目次1. はじめに2. JDBCはストリーミングクエリを実装する3. パフォーマンステスト3.1. ...