vue(vue怎么學(xué))
1.vue怎么學(xué)
如果你是 Vue 開(kāi)發(fā)新手，可能已經(jīng)聽(tīng)過(guò)很多行話(huà)術(shù)語(yǔ)，比如單頁(yè)面應用程序、異步組件、服務(wù)器端渲染，等等。
你可能還聽(tīng)說(shuō)過(guò)與 Vue 有關(guān)的一些工具和庫，比如 Vuex、Webpack、Vue CLI 和 Nuxt。 浸沒(méi)在術(shù)語(yǔ)和工具的浩瀚海洋中難免會(huì )令人感到沮喪，但其實(shí)并不是只有你一個(gè)人有這種感受，所有經(jīng)驗水平的開(kāi)發(fā)人員都會(huì )持續感覺(jué)到這種莫名的壓力。
分享一張圖給你看看基礎知識：vue的生命周期： beforeCreate/created、beforeMount/mounted、beforeUpdate/updated、beforeDestory/destoryedvue常用指令： v-for、v-bind（縮寫(xiě)形式 ：prop）、v-on（縮寫(xiě)形式 @click='sss'）、v-if/v-else/v-else-if、v-model、v-once、v-html、v-show。vue自定義組件： Vue.component('componentName',{ props:['p1','p2'], template: '{{ p1 }}'})vue常用實(shí)例方法和屬性： data/$data、methods/$methods、$el、computed（計算屬性）、$watch、$set、$event、$emit。
如果需要更新的屬性需要緩存，則使用計算屬性的方式，否則可以使用 methods里的方法來(lái)更新屬性（ methods里的方法每次重新渲染都會(huì )執行）計算屬性默認提供了 getter，你還可以給它設置 setter當你數據變化是異步或者開(kāi)銷(xiāo)較大時(shí)，可以使用 watch偵聽(tīng)器來(lái)響應數據的變化v-bind:class的值可以是一個(gè)對象，可實(shí)現類(lèi)似 react中 classnames模塊的功能自定義組件上的 class會(huì )被渲染拼接到 template的根節點(diǎn)的 class屬性上（自定義組件上可使用 v-bind:class來(lái)做class的判斷顯示邏輯）v-bind:style可以用來(lái)綁定內聯(lián)樣式，這個(gè)內聯(lián)樣式的值可以由一個(gè)對象來(lái)定義（類(lèi)似css in js的模式），且可以被定義為數組（多個(gè)樣式對象）v-bind:style可以使用多重值的形式： v-if/v-else/v-else-if的時(shí)候，可以用key來(lái)管理可復用的元素v-if是'真正'的渲染，它會(huì )確保在切換條件過(guò)程中條件塊內的元素的事件監聽(tīng)器和子組件適時(shí)的銷(xiāo)毀和重建v-if是惰性的，初始為假，什么也不做，直到為真的時(shí)候才渲染元素v-show總是渲染元素，只是簡(jiǎn)單的進(jìn)行切換v-if的切換開(kāi)銷(xiāo)大， v-show則是初始渲染開(kāi)銷(xiāo)大，頻繁切換使用 v-show，運行時(shí)經(jīng)常改變則使用 v-ifv-if和 v-for一起使用時(shí)， v-for的優(yōu)先級更高v-for可遍歷數組，第二個(gè)參數是索引v-for可遍歷對象，第二個(gè)參數是 key，第三個(gè)參數是索引v-for和 搭配可減少渲染次數v-for和自定義組件使用時(shí)，需要使用 props來(lái)傳遞值盡可能的為遍歷子元素加上 key，獲得渲染優(yōu)化數組變異方法： push/pop/unshift/shift/splice/sort/reverse改變原始數組數組非變異方法： filter/concat/slice 不改變原始數組，總是返回新數組Vue不能檢測到數組索引賦值（使用 vm.$set解決）和修改 length長(cháng)度賦值（使用 splice解決）的情況Vue不能檢測對象屬性的添加和刪除（使用 vm.$set或 Object.assign）is=“todo-item”這種屬性的寫(xiě)法比較適合DOM模板事件修飾符，它們可串聯(lián)使用： .stop、.prevent、.capture、.self、.once、.passive（尤其適合移動(dòng)端）.passive不用同時(shí)和 .prevent使用，后者會(huì )被忽略按鍵修飾符： .enter、.tab、.delete、.esc、.space、.up、.down、.left、.right系統按鍵修飾符： .ctrl、.alt、.shift、.meta（?|?|◆）、.exact（允許精確控制系統修飾符組合鍵觸發(fā)）鼠標修飾符： .left、.right、.middlev-model會(huì )忽略表單元素的 value、checked、selected，僅僅使用實(shí)例中的數據作為數據源表單事件修飾符： .lazy、.number、.trim組件是可復用的vue實(shí)例，具有vue實(shí)例大多數屬性和方法組件可復用，每個(gè)組件有獨立的空間組件上的data必須是一個(gè)函數，這樣做避免影響了其他組件通過(guò) Vue.component（)全局注冊的組件可在其被注冊后的任何通過(guò) newVue（)創(chuàng )建的實(shí)例所使用，包含其組件樹(shù)中的所有組件通過(guò)插槽 分發(fā)內容（其實(shí)就是類(lèi)似于react的children）動(dòng)態(tài)組件 配合屬性 is來(lái)實(shí)現解析DOM模板時(shí)需要注意下可能會(huì )有不生效的情況，需要使用is來(lái)傳遞組件。
2.Vue.js入門(mén)先學(xué)什么
Vue是一個(gè)全新的前臺頁(yè)面框架，所用的語(yǔ)言只限于HTML元素，CSS規則，Javascript代碼，對于一個(gè)新手，這就是所需要的所有東西，但是目前的頁(yè)面開(kāi)發(fā)，不可避免的會(huì )用到一些有名的JS框架，例如Jquery,BootStrap，所以還是需要了解這些js框架的使用
Vue開(kāi)發(fā)需要用到npm，這是nodejs的組件管理工具，但事實(shí)上不需要學(xué)習nodejs的內容。
Vue需要用到的一些組件，例如webpack,vuex，都是一些組件或者是工具，不需要學(xué)習特別的語(yǔ)言，只要學(xué)習簡(jiǎn)單的調用就可以了
