vue.js的兩個核心：數據驅動、組件系統
1.什么是MVVM？
MVVM是Model-View-ViewModel的縮寫。MVVM是一種設計思想。Model 層代表數據模型， 也可以在Model中定義數據修改和操作的業務邏輯；View 代表UI 組件，它負責將數據模 型轉化成UI 展現出來，ViewModel 是一個同步View 和 Model的對象。 在MVVM架構下，View 和 Model 之間并沒有直接的聯系，而是通過ViewModel進行交互， Model 和 ViewModel 之間的交互是雙向的， 因此View 數據的變化會同步到Model中， 而Model 數據的變化也會立即反應到View 上。 ViewModel 通過雙向數據綁定把 View 層和 Model 層連接了起來，而View 和 Model 之間的同步工作完全是自動的，無需人為干涉，因此開發者只需關注業務邏輯， 不需要手動操作DOM, 不需要關注數據狀態的同步問題，復雜的數據狀態維護完全由 MVVM 來統一管理。
2. mvvm和mvc區別
都是一種設計思想。主要就是mvc中Controller演變成mvvm中的viewModel。 mvvm主要解決了mvc中大量的DOM 操作使頁面渲染性能降低，加載速度變慢， 影響用戶體驗。vue數據驅動，通過數據來顯示視圖層而不是節點操作。
3. vue的優點是什么？
低耦合，可重用性，獨立開發，漸進式，也稱塊間聯系。指軟件系統結構中各模塊間相互聯系緊密程度的一種度量。模塊之間聯系越緊密，其耦合性就越強，模塊的獨立性則越差。就是寫一個組件在任何復雜的項目任何復雜的場景下都可以即拿即用這就是低耦合視圖（View）可以獨立于Model變化和修改，一個ViewModel可以綁定到不同的"View"上， 當View變化的時候Model可以不變，當Model變化的時候View也可以不變
你可以把一些視圖邏輯放在一個ViewModel里面，讓很多view重用這段視圖邏輯
開發人員可以專注于業務邏輯和數據的開發（ViewModel），設計人員可以專注于頁面設計
漸進式框架沒有什么限制，可以在此框架上引用其他框架，不像angular1一樣 想使用框架就得使用它的一套流程限制。
vuejs吸收了react和angular的優點，強調了react組件化的概念，吸收angular靈活的指令和頁面操作的方法。
（1）只需關注model層的數據處理，無需處理復雜的view層更新，vue會在model改變時自動對view層進行更新；
（2）vue提供一系列的小工具幫助開發者處理數據綁定中得問題，比如computed可以提供計算的擴展，還有過濾器、排序等支持；
（3）代碼簡潔，分層清晰。html里進行數據綁定，js里只需處理數據以及后臺交互；
（4）提供自定義組件功能，進一步規范前端架構。
4.vue指令有哪些，分別作用是什么？
v-html 綁定DOM元素并解析
v-text 綁定元素解析為文本
v-on:事件名=’方法名’ ??綁定事件 ?等價于簡寫方式@click=’方法名’
v-show=’布爾值’ ?控制節點的顯示隱藏
v-if=’布爾值’ ??控制節點的顯示隱藏
v-model=’渲染的數據’ ?數據的雙向綁定，和表單元素配置使用
v-for ?DOM遍歷 ?for = ‘item of arr’
v-once ?讓DOM中的數據只渲染一次，不能再改動
v-bind ?綁定DOM屬性 :簡寫方式
v-cloak ?當數據真正渲染到DOM上之后才進行顯示
v-pre 讓DOM中的數據不進行解析
for循環寫法繁雜 ??for..in遍歷對象使用，不適合遍歷數組forEach 不能和continue break return配合使用 ?for..of修正以上缺點
5.methods和computed的作用
methods方法調用時計算邏輯的過程，相當于js function結算邏輯的過程,computed直接拿到的結果，是一個值，相當于js函數中的return返回值
6.methods,computed和watch的區別
methods調用一次計算一次，使用計算好的返回值時沒有computed性能高。computed計算好的結果會進行緩存，如果沒有變動，重復使用時，直接取到緩存的結果拿來使用，不會再進行計算。監聽屬性配合表單使用，當表單中綁定的屬性變化時，會觸發監聽屬性下對應的方法進行操作，當使用固定返回值要使用computed代替watch和methods
深度監聽：
arr:[{name:'李白'}] 對象類型的數據去觸發watch下的方法，要在watch對應的對象下使用語句柄handler,使用deep:true開啟深度監聽。每當改變數據時，會把整個對象遍歷一遍，查找變動的數據，然后去觸發該對象對應的方法，傳過來參數不是改動某一個值，而是把變動后的整個對象傳過來，比較消耗性能，慎用。
7.V-if和v-show區別
v-if是把節點摧毀重建,初始化渲染較小，切換開銷大，適合切換比較少的內容去使用
v-show是切換css樣式,初始化渲染開銷大，切換開銷小,適合頻繁切換的內容
8.v-for中的key
v-for的key值需要使用v-bind去綁定唯一的key，當 Vue 正在更新使用 v-for 渲染的元素列表時，它默認使用“就地更新”的策略。如果需要dom記錄自己的什么，當進行值變動時把DOM節點摧毀重建需要給他加上唯一的key值。建議盡可能在使用 v-for 時提供 key attribute，除非遍歷輸出的 DOM 內容非常簡單，或者是刻意依賴默認行為以獲取性能上的提升。
9.v-for和v-if
當v-for和v-if在同一層級時，v-for優先級始終大于v-if，先進行遍歷，再進行判斷，遍歷完之后進行的判斷不符合條件再進行隱藏，一般情況下不要v-for和v-if在同一行使用，filter
10.事件修飾符有哪些，分別的作用是什么？
stop 阻止冒泡的事件修飾符
prevent ?阻止默認行為
once 事件只執行一次
self 只能在元素本身上觸發方法
passive 阻止詢問默認行為，提高性能
capture 把冒泡事件改成捕獲事件??
11.生命周期
VUE實例化或者組件創建到消亡的過程， beforeCreate ?創建前的狀態，初始化事件和生命周期，創建完畢狀態Init (初始化) injections (依賴注入) & reactivity (開始響應)，beforeMount 掛載前狀態， 是否有元素el，是否有模板，是否渲染到了函數內，是否作為模板進行了outerHTML渲染到了頁面，向虛擬DOM上掛在的過程，并且還是把我們的‘#app’生成虛擬DOM，生成完畢后并渲染到view層，mounted 掛載結束狀態，渲染到真正的DOM，beforeUpdate可以拿到Vue實例化改變前的狀態，Updated拿到變動完成的狀態，beforeDestroy消亡前的狀態，destroyed實例化或組件被摧毀消亡。
12.生命周期的鉤子函數有哪些，分別作用是什么？
答：總共分為8個階段創建前/后，載入前/后，更新前/后，銷毀前/后。
創建前/后：?在beforeCreated階段，vue實例的掛載元素$el和數據對象data都為undefined，還未初始化。在created階段，vue實例的數據對象data有了，$el還沒有。
載入前/后：在beforeMount階段，vue實例的$el和data都初始化了，但還是掛載之前為虛擬的dom節點，data.message還未替換。在mounted階段，vue實例掛載完成，data.message成功渲染。
更新前/后：當data變化時，會觸發beforeUpdate和updated方法。
銷毀前/后：在執行destroy方法后，對data的改變不會再觸發周期函數，說明此時vue實例已經解除了事件監聽以及和dom的綁定，但是dom結構依然存在
——————————————————————————————————————
beforeCreate：Function在實例初始化之后，數據觀測 (data observer) 和 event/watcher 事件配置之前被調用。
created：Function在實例創建完成后被立即調用。在這一步，實例已完成以下的配置：數據觀測 (data observer)， 屬性和方法的運算，watch/event 事件回調。然而，掛載階段還沒開始，$el 屬性目前不可見。
beforeMount：Function在掛載開始之前被調用：相關的 render 函數首次被調用。
mounted：Function el 被新創建的 vm.el 替換，并掛載到實例上去之后調用該鉤子。如果 root 實例掛載了一個文檔內元素，當 mounted 被調用時 vm.$el 也在文檔內。
beforeUpdate：Function 數據更新時調用，發生在虛擬DOM 打補丁之前。這里適合在更新之前訪問現有的 DOM，比如手動移除已添加的事件監聽器。該鉤子在服務器端渲染期間不被調用，因為只有初次渲染會在服務端進行。
updated：Function 由于數據更改導致的虛擬DOM 重新渲染和打補丁，在這之后會調用該鉤子。
beforeDestroy：Function 實例銷毀之前調用。在這一步，實例仍然完全可用。該鉤子在服務器端渲染期間不被調用。
destroyed：Function Vue 實例銷毀后調用。調用后，Vue 實例指示的所有東西都會解綁定，所有的事件監聽器會被移除，所有的子實例也會被銷毀。該鉤子在服務器端渲染期間不被調用。
13.父級向子級中傳值的方法怎么實現？子級向父級中傳值的方法怎么實現？兄弟傳值怎么實現？
父傳子props ?子傳父$emit
先定義傳值的橋梁空實例化Vue，在兄弟A定義的方法中使用橋梁
觸發$emit(自定義的方法,要傳的值)方法,在兄弟B中在mounted鉤子函數中使用$on(‘自定義方法’,function(傳過來參數))自動去監聽兄弟A的自定義方法，回調函數中拿到傳遞過來的值
14.路由的配置流程：
下載腳手架時，直接下載好路由，在src文件夾下邊找到router下的index.js配置路由，創建組件，引入需要配置的組件，在routes數組下配置對象，對象中某一個路徑的path對應某一個組件，然后在App.vue下邊配置router-link中to跳轉的路徑。
15.動態配置路由的方法
id,獲取動態路由的值$route.params.id，
404在index.js routes下配置對象path對應 *,component創建對應的404組件。
在router目錄下的index.js文件中，對path屬性加上/:id。? 使用router對象的params.id
16.配置子路由的方法
在需要子路由的主頁面組件中和配置主路由一下，在路由對象下寫入children,是一個數組，在數組中配置方法和主路由一樣。
Redirect 進行路由的重定向，在router-link動態傳遞參數時需要使用v-bind綁定對象的方式，編程式導航也可以進行參數傳遞，編程式導航有 push ?replace ?go
17.路由導航守衛有哪些
（1）全局導航守衛：要寫在main.js下，beforeEach 進行全局攔截，afterEach 當組件加載完成后會執行（沒有很好的應用場景）
（2）路由獨享守衛：要寫在router index.js下的某一個路由中，beforeEnter 和全局前置守衛作用相同，但作用的范圍不同，只作用于使用的這一個組件
（3）組件內守衛：
beforeRouteEnter 和全局前置守衛用法相同，但是該鉤子函數中拿不到組件中的數據，需要在next參數中使用函數方法去獲取當前組件的數據
beforeRouteUpdate 路由變更時執行該函數
beforeRouteLeave ?當用戶要離開時執行該函數，詢問用戶是否要離開
18.vue全家桶：
腳手架v-cli? ? 路由router? ? http請求模塊->axios? ? Vuex狀態管理? ? UI框架
19.axios配置流程
先下載axios,在main.js中引入后把axios掛在到Vue的原型自定義屬性下，使用this.axios.get(‘路徑’) ?post(‘路徑’,傳遞到后臺的數據),一般情況成功后會返回內容，把請求的內容裝在vue組件中的數據中，然后使用v-for進行遍歷展示在頁面上。
20.Axios請求的別名，除了get和post請求還有請他請求方式嗎？
axios.request(config)
axios.get(url[, config])
axios.delete(url[, config])
axios.head(url[, config])
axios.options(url[, config])
axios.post(url[, data[, config]])
axios.put(url[, data[, config]])
axios.patch(url[, data[, config]])
語義化的請求
21.vuex的作用是什么？會出現什么BUG？?
狀態管理,把組件中的公有拆離出來，讓每個組件都可以公用這些屬性。
vuex與click事件頁面刷新就出現bug。
22.Vuex下邊有哪幾個模塊，分別的作用是什么？
State:儲存公有數據
Getters:相當于vue下計算屬性，也有緩存，處理公有數據的計算
Mutations:相當于vue下methods，進行公有數據的方法操作，但是使用時要使用$store.commit去觸發mutations中的方法
Actions:異步操作mutations，需要使用dispatch的方法去分發mutations里邊的方法
Modules:可以把store中的各個模塊進行拆分
23.ref的作用？
Vue在DOM行間綁定ref屬性，可以在js操作中使用this.$refs的方法拿到真實的DOM，進行DOM操作。
24.在方法中怎么在真實DOM渲染之后再去拿到方法中變動之后的值？ ?
this.$nextTick(()=>{拿到渲染之后的值})
25.插槽作用？
在父組件調用子組件時，在子組件調用處中寫入內容，然后在子組件中使用v-slot進行分發內容，讓分發的內容渲染到子組件的DOM，這就是插槽的作用。
26.具名插槽是什么？
使用插槽時給插槽取上名字，在父組件中使用v-slot指令去查找子組件中slot中name的屬性，讓DOM插入一一對應。
27.作用域插槽時什么？
在子組件中使用v-bind把數據傳遞給父組件，父組件中插槽處自定義屬性可以拿到子組件傳遞過來的數據去使用。
