01 vue初認識

vue
公式api:https://cn.vuejs.org/v2/guide/
紹介する
1、プログレッシブフレーム
vueはユーザインタフェースを構築する漸進的なフレームワークであり,ボトムアップ増分開発の設計を採用している.vueのコアライブラリは、ビューレイヤのみに注目し、使いやすいだけでなく、サードパーティのライブラリや既存のプロジェクトとの統合も容易です.プログレッシブ表現:宣言レンダリング-コンポーネントシステム-クライアントルーティング-ビッグデータ状態管理-構築ツール
2、二つの核心点
(1)応答型データバインディングデータが変化すると、ビューが自動的に更新、すなわち双方向データ同期され、ES 6におけるObjectが原理的に利用する.definedPropertyのsetter/getterエージェントデータは、データの操作を監視します.(2)組み合わせたビューコンポーネントであるページは最終的に1つのコンポーネントツリーにマッピングされ、ツリーデータ構造を採用して設計され、メンテナンス、再利用が容易である.
3、仮想DOM
メモリに生成されたリアルDOMに対応するデータ構造を用いて,このメモリに生成された構造を仮想DOMと呼ぶ.データが変化すると、再レンダリングコンポーネントの最小コストをスマートに計算し、DOM操作に適用することができる.
4、MVVM
MVVMはModel-View-View Modelの略で、フロントエンドに基づいて開発されたアーキテクチャモデルであり、その核心はViewとView Modelの双方向データバインディングを提供することであり、これによりView Modelの状態変化が自動的にViewに伝達される、いわゆるデータ双方向バインディングである.M:Model(データ層、つまりデータ(フロントエンドはjs))V:View(つまりDOM層またはユーザインタフェース)VM:ViewModel(データとインタフェースを処理する中間層、すなわちVue)
5、宣言レンダリング
Vue.jsの核心は,簡潔なテンプレート構文を用いてDOMにデータを宣言的にレンダリングできるシステムである.其他补充:レンダリング分为:コマンドレンダリングと宣言レンダリングコマンドレンダリング:コマンド私达のプログラムは何をして、プログラムはあなたのコマンドに従って一歩一歩声明レンダリングを実行します:プログラムにどんな効果がほしいかを教えるだけで、その他はプログラムに具体的な区别をして以下のコードを见て、実行结果は同じで、実现方法は异なります.

    var arr = [1, 2, 3, 4, 5];

    //      ：    ，    ，      
    var newArr = [];
    for(var i = 0, len = arr.length; i < len; i++) {
        newArr.push(arr[i] * 2);
    }
    console.log(newArr);

    //      ：       ，            
    var arr1 = arr.map(function(item) {
        return item*2;
    });
    console.log(arr1);

最初のコードの実行

	
		
		
		
	
	
		

			
			{{message}}
		

		
			var app = new Vue({ //   Vue  。Vue     。
				el: '#app', // el  ：   Vue      div   ，#app id   
				data: { // data:  Vue        
					message: 'hello Vue!' // message       
				}
			})
		
	

結果

hello Vue!