【アウトプット㊻】-Vue- Vue.jsとは

2020年11月8日 15:53

Vue.jsとは

ユーザーインターフェイスを構築するためのプログレッシブフレームワーク。

◎他のプログラミング言語と比べて学習コストが低い
◎MMVVMモデル型のため、レスポンスが早い
◎DOMを操作するコード量を減らすことができるため、開発スピードが早くなる

▼HTML

<body>

<script src="https://cdn.jsdelivr.net/npm/vue@2.6.11"></script>
<script src="js/main.js"></script>
</body>

bodyタグの末尾に挿入する
※jsファイルは最後に読み込む

◎NPM

◎直接組み込む

var app= new Vue({

})

この形は決まり文句みたいなもの

HTML ベースのテンプレート構文を使用した、描画部分に関する記述をする

▼HTML

<div id="app">
       
</div>

▼vue.js

let app = new Vue({
  el: "#app",
  data: {
     message: "こんにちは"
   }    
});

Vue. js を動作させるためのオプションを「オプション名: 値」のハッシュ形式で指定できる。
elは、アプリケーションを紐付ける要素セレクタを指定する。
idがappである要素の配下で、Vue.jsが有効となる。

▼表示結果