認識Vue

vue是什麼

Vue (讀音 /vjuː/，相似於 view) 是一套用於構建用戶界面的漸進式JavaScript框架。

與其它大型框架不一樣的是，Vue 被設計爲能夠自底向上逐層應用。Vue 的核心庫只關注視圖層，方便與第三方庫或既有項目整合。

Vue的目標是經過儘量簡單的API實現響應式的數據綁定和組合的試圖組件。

Vue.js 自身不是一個全能框架——它只聚焦於視圖層。所以它很是容易學習，很是容易與其它庫或已有項目整合。另外一方面，在與相關工具和支持庫一塊兒使用時，Vue.js 也能完美地驅動複雜的單頁應用。

軟件名稱：Vue.js

做者：尤雨溪

版本：vue0.十一、vue0.十二、vue1.0、vue2.0

軟件語言：JavaScript

初始與穩定版本：0.十一、2.6.16

MVVM

關於Vue的MVVM的概念介紹，能夠分爲三個部分：

• M，Model 模型層，指的是數據部分，主要負責業務數據相關。
• V，View 視圖層，指的是視圖部分，負責視圖相關，也就是html+css層。
• VM，ViewModel V與M鏈接的橋樑，就是鏈接視圖與數據的中間件，至關於一個控制器，負責監聽M或者V的修改，實現數據的雙向綁定。

數據/視圖

數據（VM）

const app = new Vue({
    el: '#main',
        data: {
            message: 1
    }
})

視圖（V）

<div id="main">
    <input v-model="message" />
    <br />
    <span>{{ message }}</span>
</div>

組件化（Components）

官方定義：組件系統是Vue的另外一個重要概念，由於它是一種抽象，容許咱們使用小型、獨立和一般可複用的組件構建大型應用，幾乎任何類型的應用界面均可以抽象爲一個組件樹。

組件是Vue.js 最強大的功能之一，它能夠擴展HTML元素，封裝可重用的代碼。在較高層面上，組件是自定義元素，Vue.js 的編譯器爲它添加特殊功能。在某些狀況下，組件也能夠表現爲用 is 特性進行原生HTML元素的擴展。

全部的 Vue 組件同時也都是 Vue 的實例。

Vue.component('todo-item', {
    template: '<li>這是個待辦項</li>'
})
​
<ol>
    <!-- 建立一個 todo-item 組件的實例 -->
    <todo-item></todo-item>
</ol>

開發模式

• 聲明式渲染
• 組件系統
• 客戶端路由
• 大規模狀態管理
• 構建工具

瀏覽器兼容

Vue 不支持 IE8 及如下版本，由於 Vue 使用了 IE8 沒法模擬的 ECMAScript 5 特性。但它支持全部兼容 ECMAScript 5 的瀏覽器。

底層原理：ES5 -> Object.defineProperty()