1.vue中的MVVM模式

即Model-View-ViewModel。

Vue是以數據為驅動的，Vue自身將DOM和數據進行綁定，一旦創建綁定，DOM和數據將保持同步，每當數據發生變化，DOM會跟著變化。

ViewModel是Vue的核心，它是Vue的一個實例。Vue實例時作用域某個HTML元素上的，這個HTML元素可以是body，也可以是某個id所指代的元素。

DOM Listeners和Data Bindings是實現雙向綁定的關鍵。DOM Listeners監聽頁面所有View層DOM元素的變化，當發生變化，Model層的數據隨之變化；Data Bindings監聽Model層的數據，當數據發生變化，View層的DOM元素隨之變化。

2.v-show指令，v-if的區別

條件渲染指令，與v-if不同的是，無論v-show的值為true或false，元素都會存在於HTML代碼中；而只有當v-if的值為true，元素才會存在於HTML代碼中。v-show指令只是設置了元素CSS的style值

3.如何讓css只在當前組件中起作用

在每一個vue組件中都可以定義各自的css，js，如果希望組件內寫的css只對當前組件起作用，只需要在style中寫入scoped，即：

<style scoped></style>

4.指令keep-alive

在vue-router寫著keep-alive，keep-alive的含義：

如果把切換出去的組件保留在內存中，可以保留它的狀態或避免重新渲染。為此可以添加一個keep-alive指令

<component :is=‘curremtView‘ keep-alive></component>

5.Vuejs組件

vuejs構建組件使用

Vue.component(‘componentName‘,{ /*component*/ })； 這裏註意一點，組件要先註冊再使用

Vue.component(‘mine‘,{

template:‘#mineTpl‘,

props:[‘name‘,‘title‘,‘city‘,‘content‘]

});

var v=new Vue({

el:‘#vueInstance‘,

data:{

name:‘zhang‘,

title:‘this is title‘,

city:‘Beijing‘,

content:‘these are some desc about Blog‘

}

});

6.路由嵌套

路由嵌套會將其他組件渲染到該組件內，而不是進行整個頁面跳轉router-view本身就是將組件渲染到該位置，想要進行頁面跳轉，就要將頁面渲染到根組件，在起始配置路由時候寫到：

var App = Vue.extend({ root });

router.start(App,‘#app‘);

這裏首先將根組件註冊進來，用於將路由中配置好的各個頁面渲染出來，然後將根組件掛載到與#app匹配的元素上。

7.指令v-el的使用

有時候我們想就像使用jquery那樣去訪問一個元素，此時就可以使用v-el指令，去給這個元素註冊一個索引，方便通過所屬實例的$el訪問這個元素。

註意

HTML不區分大小寫，所以v-el:someEl將轉換為全小寫。可以用v-el:some-el然後設置this.$el.someEl。

示例

<span v-el:msg>hello</span>

<span v-el:other-msg>world</span>

this.$els.msg.textContent // -> "hello"

this.$els.otherMsg.textContent // -> "world"

this.$els.msg //-><span>hello</span>

8.vuejs中使用事件名

在vuejs中，我們經常要綁定一些事件，有時候給DOM元素綁定，有時候給組件綁定。綁定事件在HTML中用v-on:click-"event",這時evet的名字不要出現大寫，因為在1.x中不區分大小寫，所以如果我們在HTML寫v-on:click="myEvent"而在js中寫myEvent就出錯誤，所以在vuejs的1.x綁定事件時候，要盡量避免使用大寫字母。在2.0中沒有該限制！

9.Vue.js是什麽

Vue.js（是一套構建用戶界面的 漸進式框架。與其他重量級框架不同的是，Vue 采用自底向上增量開發的設計。Vue 的核心庫只關註視圖層，並且非常容易學習，非常容易與其它庫或已有項目整合。另一方面，Vue 完全有能力驅動采用單文件組件和Vue生態系統支持的庫開發的復雜單頁應用。

Vue.js 的目標是通過盡可能簡單的 API 實現響應的數據綁定和組合的視圖組件

10.VueJS 特性：

I: MVVM模式（數據變量（model）發生改變 視圖（view）也改變， 視圖（view）改變，數據變量（model）也發生改變）

使用MVVM模式有幾大好處：

　　1. 低耦合。View可以獨立於Model變化和修改，一個ViewModel可以綁定到不同的View上，當View變化的時候Model可以不變，當Model變化的時候View也可以不變。

　　2. 可重用性。可以把一些視圖的邏輯放在ViewModel裏面，讓很多View重用這段視圖邏輯。

　　3. 獨立開發。開發人員可以專註與業務邏輯和數據的開發(ViewModel)。設計人員可以專註於界面(View)的設計。

　　4. 可測試性。可以針對ViewModel來對界面(View)進行測試

II: 組件化

III 指令系統

IIII: vue2.0開始支持虛擬dom

vue1.0是操作的是真的dom元素而不是虛擬的

虛擬dom:可以提升頁面的刷新速度

虛擬DOM有利也有弊。

A：大小 - 其中之一就是更多的功能意味著代碼包中更多行的代碼。幸運的是，Vue.js 2.0 依舊比 較小（當前版本 21.4kb），並

且也正在刪除很多東西。

B: 內存 -同樣，虛擬DOM需要將現有的DOM拷貝後保存在內存中，這是一個在DOM更新速度和內存使用中的權衡。

C: 並不適用所有情況 -如果虛擬DOM可以一次性進行批量的修改是非常好的。但是如果是單獨的、稀少的更新呢？這樣的任何

DOM更新都將會使虛擬DOM帶來無意義的預計算

11.Vue.js特點

簡潔：頁面由HTML模板+Json數據+Vue實例組成

數據驅動：自動計算屬性和追蹤依賴的模板表達式

組件化：用可復用、解耦的組件來構造頁面

輕量：代碼量小，不依賴其他庫

快速：精確有效批量DOM更新

模板友好：可通過npm，bower等多種方式安裝，很容易融入

12.Vue.js 和 AngularJS 之間的區別是什麽?

下面是一些選擇 Vue 而不是 Angular 的可能原因；

Vue.js 是一個更加靈活開放的解決方案。它允許你以希望的方式組織你的應用程序，而不是任何時候都必須遵循 Angular 制定的規則。它僅僅是一個視圖層，所以你可以將它嵌入一個現有頁面而不一定要做成一個龐大的單頁應用。在結合其他庫方面它給了你更大的的空間，但相應，你也需要做更多的架構決策。例如，Vue.js 核心默認不包含路由和 ajax 功能，並且通常假定你在用應用中使用了一個外部的模塊構建系統。這可能是最重要的區別

在 API 和內部設計方面，Vue.js 比 Angular 簡單得多, 因此你可以快速地掌握它的全部特性並投入開發。

Vue.js 擁有更好的性能，因為它不使用臟檢查。當 watcher 越來越多時, Angular 會變得越來越慢，因為作用域內的每一次數據變更，所有的 watcher 都需要被重新求值。Vue 則根本沒有這個問題，因為它采用的是基於依賴追蹤的觀察系統，所以所有的數據變更觸發都是獨立的，除非它們之間有明確的依賴關系。

Vue.js 中指令和組件的概念區分得更為清晰。指令只負責封裝 DOM 操作，而組件代表一個自給自足的獨立單元 —— 它擁有自己的視圖和數據邏輯。在 Angular 中它們兩者間有不少概念上的混淆。

13.Vue.js 和 React.js 有什麽區別?

React.js 和 Vue.js 確實有一些相似——它們都提供數據驅動、可組合搭建的視圖組件。然而，它們的內部實現是完全不同的。React 是基於 Virtual DOM——一種在內存中描述 DOM 樹狀態的數據結構。React 中的數據通常被看作是不可變的，而 DOM 操作則是通過 Virtual DOM 的 diff 來計算的。與之相比，Vue.js 中的數據默認是可變的，而數據的變更會直接出發對應的 DOM 更新。相比於 Virtual DOM，Vue.js 使用實際的 DOM 作為模板，並且保持對真實節點的引用來進行數據綁定。

Virtual DOM 提供了一個函數式的描述視圖的方法，這很 cool。因為它不使用數據觀察機制，每次更新都會重新渲染整個應用，因此從定義上保證了視圖通與數據的同步。它也開辟了 JavaScript 同構應用的可能性。

實話實說，我自己對 React 的設計理念也是十分欣賞的。但 React 有一個問題就是組件的邏輯和視圖結合得非常緊密。對於部分開發者來說，他們可能覺得這是個優點，但對那些像我一樣兼顧設計和開發的人來說，還是更偏好模板，因為模板能讓我們更好地在視覺上思考設計和 CSS。JSX 和 JavaScript 邏輯的混合幹擾了我將代碼映射到設計的思維過程。相反，Vue.js 通過在模板中加入一個輕量級的 DSL (指令系統)，換來一個依舊直觀的模板，且能夠將邏輯封裝進指令和過濾器中。

React 的另一個問題是：由於 DOM 更新完全交由 Virtual DOM 管理，當你真的想要自己控制 DOM 是就有點棘手了（雖然理論上你可以，但這樣做時你本質上在對抗 React 的設計思想）。對於需要復雜時間控制的動畫來說這就變成了一項很討人厭的限制。在這方面，Vue.js 允許更多的靈活性，並且有不少用 Vue.js 構建的富交互實例

vue知識點總結