1、V-if和V-show的區(qū)別
答案：區(qū)別就是dom元素是否掛載了鹃祖，v-show是dom樹上有內(nèi)容溪椎，不顯示，display：none恬口；v-if是dom樹上無(wú)內(nèi)容
2校读、Vue組件間是怎么通訊的
答案：1、父組件-->子組件
? 方式：父組件給子組件綁定屬性祖能，子組件通過(guò)props屬性來(lái)接收傳遞的數(shù)據(jù)
? 注意：屬性的值必須在組件中通過(guò)props屬性指定歉秫，屬性名必須與父組件中定義的一致。props可以是一個(gè)數(shù)組或?qū)ο?/p>
? 2养铸、子組件-->父組件
? 方式：在父組件中聲明一個(gè)接受數(shù)據(jù)的函數(shù),父組件給子組件綁定事件雁芙，子組件通過(guò)$emit觸發(fā)事件，并且可在此時(shí)傳遞參數(shù)钞螟，
? 父組件通過(guò)定義好的監(jiān)聽事件接收參數(shù)（注意參數(shù)是什么 ）
? 3兔甘、非父子組件間的通訊
? 方式: 創(chuàng)建一個(gè)新Vue的實(shí)例，讓各個(gè)兄弟共用同一個(gè)事件機(jī)制鳞滨。（關(guān)鍵點(diǎn)）
? 傳遞數(shù)據(jù)方洞焙，通過(guò)事件觸發(fā)$emit(方法名， 傳遞的數(shù)據(jù))拯啦。
? 接收數(shù)據(jù)方澡匪，在mounted() 鉤子函數(shù)(掛載實(shí)例) 中 觸發(fā)事件$on(方法名， callback(接收數(shù)據(jù)的數(shù)據(jù)))褒链，
? 此時(shí)callback函數(shù)中的this已經(jīng)發(fā)生了改變唁情， 可以使用箭頭函數(shù)。
? 對(duì)于大型復(fù)雜的項(xiàng)目碱蒙，采用vuex 狀態(tài)管理更適合
3荠瘪、常見指令
答案：
? v-text:更新DOM對(duì)象的 textContent
? v-html:更新DOM對(duì)象的 innerHTML
? v-bind:當(dāng)表達(dá)式的值改變時(shí)，將其產(chǎn)生的連帶影響赛惩，響應(yīng)式地作用于 DOM
? v-on:綁定事件
? v-for:基于源數(shù)據(jù)多次渲染元素或模板塊
? v-if：根據(jù)表達(dá)式的值的真假條件哀墓，銷毀或重建元素
? v-show：根據(jù)表達(dá)式之真假值，切換元素的 display CSS 屬性
? v-pre:跳過(guò)這個(gè)元素和它的子元素的編譯過(guò)程喷兼±捍拢可以用來(lái)顯示原始 Mustache 標(biāo)簽。跳過(guò)大量沒有指令的節(jié)點(diǎn)會(huì)加快編譯
? v-once:只渲染元素和組件一次季惯。隨后的重新渲染吠各，元素/組件及其所有的子節(jié)點(diǎn)將被視為靜態(tài)內(nèi)容并跳過(guò)臀突。這可以用于優(yōu)化更新性能
4、怎么定義組件
答案：
? 全局定義：Vue.component(組件名, {template: 模板字符串})
? 局部定義：components:{組件名: {template: 模板字符串}}
? 單文件組件：包含template贾漏，script候学，style三部分
5、vue路由是怎么做的（路由的原理）
答案：瀏覽器URL中的哈希值（# hash）和 component的對(duì)應(yīng)關(guān)系纵散，一個(gè)哈希值對(duì)應(yīng)一個(gè)組件
6梳码、怎么請(qǐng)求數(shù)據(jù)的
答案：用axios發(fā)送請(qǐng)求
7、談?wù)劷M件化和模塊化的區(qū)別
答案：
? 組件化：組件化就是基于可重用的目的伍掀，將一個(gè)大的軟件系統(tǒng)按照分離關(guān)注點(diǎn)的形式掰茶，拆分成多個(gè)獨(dú)立的組件，主要目的就是減少耦合蜜笤。
? 一個(gè)獨(dú)立的組件可以是一個(gè)軟件包濒蒋、web服務(wù)、web資源或者是封裝了一些函數(shù)的模塊把兔。
? 這樣沪伙，獨(dú)立出來(lái)的組件可以單獨(dú)維護(hù)和升級(jí)而不會(huì)影響到其他的組件。
? 模塊化：模塊化的目的在于將一個(gè)程序按照其功能做拆分垛贤，分成相互獨(dú)立的模塊焰坪，
? 以便于每個(gè)模塊只包含與其功能相關(guān)的內(nèi)容，模塊之間通過(guò)接口調(diào)用聘惦。
? 將一個(gè)大的系統(tǒng)模塊化之后，每個(gè)模塊都可以被高度復(fù)用儒恋。
? 區(qū)別：模塊化的目的是為了重用善绎，模塊化后可以方便重復(fù)使用和插撥到不同的平臺(tái)，不同的業(yè)務(wù)邏輯過(guò)程中诫尽。
? 組件化的目的是為了解耦禀酱，把系統(tǒng)拆分成多個(gè)組件，分離組件邊界和責(zé)任牧嫉，便于獨(dú)立升級(jí)和維護(hù)剂跟。
8、Vue的數(shù)據(jù)雙向綁定原理（如果更深層的話就要涉及到訂閱發(fā)布者模式了可以自己看）
答案：
? Vue在初始化實(shí)例的時(shí)候酣藻，會(huì)把data中所有的數(shù)據(jù)曹洽，用Object.defineProperty方法全部加給vm對(duì)象，
? 這個(gè)時(shí)候辽剧，vm對(duì)象中的數(shù)據(jù)就有了set和get方法送淆，set這個(gè)函數(shù)會(huì)在屬性被賦值的時(shí)候自動(dòng)調(diào)用，
? get這個(gè)函數(shù)會(huì)在屬性被獲取值的時(shí)候自動(dòng)調(diào)用怕轿，用戶獲取到的屬性的值偷崩，其實(shí)就是get方法的返回值辟拷。也就能實(shí)現(xiàn)雙向綁定了
9、Vue全家桶有些什么
? vue：主要Vue
? vue-router：關(guān)于路由方面的配置
? vuex：數(shù)據(jù)共享和緩存用
? vue-resource：于后臺(tái)交互用（現(xiàn)在改為axios 但是axios不是Vue里面的東西）
? vue-cli：快速創(chuàng)建項(xiàng)目的腳手架
答案：
10阐斜、Filter過(guò)濾器
作用：
? 文本數(shù)據(jù)格式化 , 也就是: 將數(shù)據(jù)按照我們指定的一種格式輸出（可以直接說(shuō)過(guò)濾）
? 過(guò)濾器可以用在兩個(gè)地方：{{}}和 v-bind 表達(dá)式
? 兩種過(guò)濾器：1 全局過(guò)濾器 2 局部過(guò)濾器
11衫冻、Vue生命周期
一個(gè)組件從開始到最后消亡所經(jīng)歷的各種狀態(tài)，就是一個(gè)組件的生命周期
? beforeCreate()
? 說(shuō)明：在實(shí)例初始化之后谒出，數(shù)據(jù)觀測(cè) (data observer) 和 event/watcher 事件配置之前被調(diào)用
? 注意：此時(shí)隅俘，無(wú)法獲取 data中的數(shù)據(jù)、methods中的方法
? created()
? 說(shuō)明：這是一個(gè)常用的生命周期到推，可以調(diào)用methods中的方法考赛、改變data中的數(shù)據(jù)
? beforeMounted()
? 說(shuō)明：在掛載開始之前被調(diào)用,此時(shí)無(wú)法獲取到el中的DOM元素
? mounted()
? 說(shuō)明：此時(shí)，vue實(shí)例已經(jīng)掛載到頁(yè)面中莉测，可以獲取到el中的DOM元素颜骤，進(jìn)行DOM操作
? beforeUpdated()
? 說(shuō)明：數(shù)據(jù)更新時(shí)調(diào)用，發(fā)生在虛擬 DOM 重新渲染和打補(bǔ)丁之前捣卤。你可以在這個(gè)鉤子中進(jìn)一步地更改狀態(tài)忍抽，這不會(huì)觸發(fā)附加的重渲染過(guò)程。
? 注意：此處獲取的數(shù)據(jù)是更新后的數(shù)據(jù)董朝，但是獲取頁(yè)面中的DOM元素是更新之前的
? updated()
? 說(shuō)明：組件 DOM 已經(jīng)更新鸠项，所以你現(xiàn)在可以執(zhí)行依賴于 DOM 的操作
? beforeDestroy()
? 說(shuō)明：實(shí)例銷毀之前調(diào)用。在這一步子姜，實(shí)例仍然完全可用祟绊。
? 使用場(chǎng)景：實(shí)例銷毀之前，執(zhí)行清理任務(wù)哥捕，比如：清除定時(shí)器等
? destroyed()
? 說(shuō)明：Vue 實(shí)例銷毀后調(diào)用牧抽。調(diào)用后，Vue 實(shí)例指示的所有東西都會(huì)解綁定遥赚，所有的事件監(jiān)聽器會(huì)被移除扬舒，所有的子實(shí)例也會(huì)被銷毀。
12凫佛、小程序和vue的區(qū)別和聯(lián)系
? 區(qū)別：微信小程序是運(yùn)行在微信里的APP讲坎，vue是一個(gè)流行框架
? 聯(lián)系：微信小程序借鑒了vue的部分語(yǔ)法，但也有一些區(qū)別愧薛，例如：顯示隱藏元素晨炕，v-show和hidden；事件處理：v-on和bindtap
13厚满、Vuex的使用和五個(gè)核心
五個(gè)核心：state , getter , mutation , action , module
14府瞄、vue中Tab欄怎么實(shí)現(xiàn)
? 每一個(gè)tab標(biāo)題對(duì)應(yīng)一個(gè)tab組件，并且每一個(gè)標(biāo)題都有一個(gè)點(diǎn)擊事件和傳入的參數(shù)，在點(diǎn)擊的時(shí)候tab組件接收參數(shù)來(lái)控制顯示和隱藏
? 也可以用路由實(shí)現(xiàn)遵馆，適用于全屏的tab
15鲸郊、在vue中獲取dom元素
? 在vue中可以通過(guò)給標(biāo)簽加ref屬性，就可以在js中利用$refs去引用它货邓，從而操作該dom元素
16秆撮、vue單頁(yè)面 首屏加載怎么優(yōu)化
按需加載
基于DllPlugin 和 DllReferencePlugin 的 webpack 構(gòu)建優(yōu)化
異步組件
優(yōu)化組件加載時(shí)機(jī)
18、什么是MVVM换况。分別描述一下你對(duì)MVVM優(yōu)缺點(diǎn)的理解
? 即：Model-View-ViewModel 它是一種基于前端開發(fā)的架構(gòu)模式,其核心是提供對(duì)View 和 ViewModel 的雙向數(shù)據(jù)綁定职辨，
? 這使得ViewModel 的狀態(tài)改變可以自動(dòng)傳遞給 View，即所謂的數(shù)據(jù)雙向綁定戈二。
? MVVM不僅簡(jiǎn)化了業(yè)務(wù)與界面的依賴關(guān)系舒裤，還優(yōu)化了數(shù)據(jù)頻繁更新的解決方案，甚至可以說(shuō)提供了一種有效的解決模式觉吭。
? MVVM用來(lái)做服務(wù)端是極其不適用的腾供，因?yàn)椋壕W(wǎng)絡(luò)資源成本過(guò)高 開發(fā)成本過(guò)高
19、vue.js的view-model是如何工作的
? Vue.js 是一個(gè)提供了 MVVM 風(fēng)格的雙向數(shù)據(jù)綁定的 Javascript 庫(kù)鲜滩，專注于View 層伴鳖。
? 它的核心是 MVVM 中的 VM，也就是 ViewModel徙硅。 ViewModel負(fù)責(zé)連接 View 和 Model榜聂，
? 保證視圖和數(shù)據(jù)的一致性，這種輕量級(jí)的架構(gòu)讓前端開發(fā)更加高效嗓蘑、便捷须肆。
20、vue中$set什么時(shí)候用
? 生成vue實(shí)例后桩皿，當(dāng)再次給數(shù)據(jù)賦值時(shí)休吠，有時(shí)候并不會(huì)自動(dòng)更新到視圖上去，此時(shí)使用 vm.$set實(shí)例方法业簿，這也是全局 Vue.set方法的別名
21、Vue-cli的src文件夾中有哪些文件
? assets中是圖片阳懂，字體等一些靜態(tài)資源
? components中是組件
? filters中是過(guò)濾器
? router中是路由文件
? App.vue 根組件
? mian.js
22梅尤、vue-router有哪幾種導(dǎo)航鉤子？（具體怎么用的）
三種岩调，
第一種：是全局導(dǎo)航鉤子：router.beforeEach(to,from,next)巷燥，作用：跳轉(zhuǎn)前進(jìn)行判斷攔截。
第二種：組件內(nèi)的鉤子
第三種：?jiǎn)为?dú)路由獨(dú)享組件
23号枕、路由之間是如何跳轉(zhuǎn)的跳轉(zhuǎn)缰揪？
? 1、router-link to = 'path'
? 2、router.push('path')
24钝腺、怎么定義vue-router的動(dòng)態(tài)路由抛姑？怎么獲取傳過(guò)來(lái)的動(dòng)態(tài)參數(shù)？
? 在router目錄下的index.js文件中艳狐，對(duì)path屬性加上/:id定硝。 使用router對(duì)象的params.id
25、vue-router是什么毫目？它有哪些組件蔬啡？
? vue用來(lái)寫路由一個(gè)插件。router-link镀虐、router-view
26箱蟆、如何讓CSS只在當(dāng)前組件中起作用?
? 將當(dāng)前組件的style修改為<style scoped>
27、<keep-alive></keep-alive>的作用是什么?
? <keep-alive></keep-alive> 包裹動(dòng)態(tài)組件時(shí)刮便，會(huì)緩存不活動(dòng)的組件實(shí)例,主要用于保留組件狀態(tài)或避免重新渲染空猜。
大白話: 比如有一個(gè)列表和一個(gè)詳情，那么用戶就會(huì)經(jīng)常執(zhí)行打開詳情=>返回列表=>打開詳情…這樣的話列表和詳情都是一個(gè)頻率很高的頁(yè)面诺核，那么就可以對(duì)列表組件使用<keep-alive></keep-alive>進(jìn)行緩存抄肖，這樣用戶每次返回列表的時(shí)候，都能從緩存中快速渲染窖杀，而不是重新渲染
28漓摩、如何實(shí)時(shí)修改data中數(shù)組中的值（數(shù)據(jù)改變?cè)噲D改變）
this.$set(this.data,”key”,value’)
? $set的使用方法自己查
29、slot是什么
? 插槽：
? 三種方式：1入客、匿名插槽
? 2管毙、具名插槽
? 3、帶參數(shù)的插槽
