1、多個組件之間如何拆分各自的state，每塊小的組件有自己的狀態，它們之間還有一些公共的狀態需要維護，如何思考這塊
（1）公共的數據部分可以提升至和他們最近的父組件，由父組件派發
（2）公共數據可以放到vuex中統一管理，各組件分別獲取
2、key主要是解決哪一類的問題，為什么不建議用索引index（重繪）
（1）key的作用主要是為了高效的更新虛擬DOM
（2）當以index為key值時，如果數組長度發生變化，會導致key的變化，比如刪除其中某一項，那么index會相應變化。
所以用index作為key和不加index沒有什么區別，都不能提升性能。一般用每項數據的唯一值來作為key，就算數組長度變化，也不會影響到這個key
3、介紹虛擬DOM
（1）讓我們不用直接操作DOM元素，只操作數據便可以重新渲染頁面
（2）虛擬dom
虛擬dom是為了解決瀏覽器性能問題而被設計出來的
當操作數據時，將改變的dom元素緩存起來，都計算完后再通過比較映射到真實的dom樹上
（3）diff算法比較新舊虛擬dom
如果節點類型相同，則比較數據，修改數據
如果節點不同，直接干掉節點及所有子節點，插入新的節點
如果給每個節點都設置了唯一的key，就可以准確的找到需要改變的內容，否則就會出現修改一個地方導致其他地方都改變的情況。
比如A-B-C-D, 我要插入新節點A-B-M-C-D,實際上改變的了C和D。但是設置了key，就可以准確的找到B C並插入
dom樹介紹直通車 ：https://www.jianshu.com/p/af0b398602bc（個人覺得還不錯很容易懂）
4、介紹高階組件
5、如何解決props層級過深的問題
(1)使用vuex
(2)傳遞數據，使用以下接收（均不含被props接收的數據）
this.$attrs 接收屬性
this.$listeners 接收事件（不含被 .native 修飾符的事件）
6、vue中如何編寫可復用的組件
（1）以組件功能命名
（2）只負責ui的展示和交互動畫，不要在組件里與服務器打交道（獲取異步數據等）
（3）可復用組件不會因組件使用的位置、場景而變化。盡量減少對外部條件的依賴。
7、vue中對象更改檢測的注意事項
8、解決非工程化項目初始化頁面閃動問題
vue頁面在加載的時候閃爍花括號{{}}，使用v-cloak，隱藏未編譯時候的標簽 //css樣式 [v-cloak] { display: none; } //html代碼 <div v-cloak> <ul> <li >{{ text }}</li> </ul> </div>
9、十個常用的自定義過濾器
（1）去除空格
（2）時間轉換
（3）大小寫轉換
（4）字符串替換
（5）金額字符轉金額/數字轉金額字符
（6）保留兩位小數
（7）判斷字符串長度並省略
...
根據自己常用的來說
10、vue彈窗后如何禁止滾動條滾動？
methods : { //禁止滾動 stop(){ var mo=function(e){e.preventDefault();}; document.body.style.overflow='hidden'; document.addEventListener("touchmove",mo,false);//禁止頁面滑動 }, /***取消滑動限制***/ move(){ var mo=function(e){e.preventDefault();}; document.body.style.overflow='';//出現滾動條 document.removeEventListener("touchmove",mo,false); }
11、完整的 vue-router 導航解析流程
12、vue-router的幾種實例方法以及參數傳遞
13、vue-router如何定義嵌套路由？
在這種場景下就需要用到嵌套路由
const router = new VueRouter({
routes: [
{ path: '/testPage',
component: testPage,
children: [
{
path: '/sonPageA',
component: sonPageA
},
{
path: '/sonPageB',
component: sonPageB
}，
]
}，
{
// 其他和testPage平級的路由
}
]
})
14、vue-router如何實現路由懶加載（ 動態加載路由 ）
15、vue-router路由的兩種模式
vue-router中默認使用的是hash模式
（1）hash模式
http://localhost:8080/#/pageA
hash 的值為 #/pageA
改變hash，瀏覽器本身不會有任何請求服務器動作的，但是頁面狀態和url已經關聯起來了。
（2）history模式
http://localhost:8080/ 正常的而路徑，並沒有#
16、vuex的核心概念
state => 基本數據
getters => 從基本數據派生的數據
mutations => 修改數據，同步
actions => 修改數據，異步
modules => 模塊化Vuex
17、vue如何優化首屏加載速度？
（1）按需加載組件，不一次性加載所有組件 （2）減少打包js，如果打包后的js文件過大，會阻塞加載。如下：
A、在index.html文件中： <script src="/static/common/js/vue.min.js"></script> B、在vue.config.js文件中配置: config.externals({ vue: 'Vue', }) 配置兩個步驟，不打包vue （3）關閉sourcemap，開啟壓縮代碼 vue.config.js文件中配置：productionSourceMap: false, （4）加個好看的loading效果
18、Vue.js 全局運行機制
19、響應式系統的基本原理
20、怎么注冊插件
使用全局方法Vue.use() Vue.use( MyPlugin ) com.js中 import com from './xx.vue' let test = {} test.install = function(Vue,options){ Vue.component(panel.name, panel) // 注冊全局組件 } export default com main.js中 import com from './com.js' Vue.use(com) 所有vue文件中都可以調用組件<com></com>
21、如何編譯template 模板？
compile編譯會有三個過程
（1）parse 根據正則進行字符串解析，得到指令、class、style等數據，形成語法樹（AST）
（2）對 parse 生成的 AST 進行靜態內容的優化，標記靜態節點（和數據沒有關系不需要每次都刷新的內容），標記靜態根節點。
（3）generate 生成 render
生成 render 的 generate 函數的輸入也是 AST，它遞歸了 AST 樹，為不同的 AST 節點創建了不同的內部調用方法，等待后面的調用。
compile編譯模板好文直通車: https://segmentfault.com/a/1190000012922342
22、diff算法
diff算法比較新舊虛擬dom
如果節點類型相同，則比較數據，修改數據
如果節點不同，直接干掉節點及所有子節點，插入新的節點
如果給每個節點都設置了唯一的key，就可以准確的找到需要改變的內容，否則就會出現修改一個地方導致其他地方都改變的情況。比如A-B-C-D, 我要插入新節點A-B-M-C-D,實際上改變的了C和D。但是設置了key，就可以准確的找到B C並插入
23、批量異步更新策略及 nextTick 原理？
（1）批量異步策略
Vue 在修改數據后，視圖不會立刻更新，而是等同一事件循環中的所有數據變化完成之后，再統一進行視圖更新。
（2）nextTick
在下一次DOM更新循環結束之后執行延遲回調
24、vue中proxy代理？
25、vue開發命令 npm run dev 輸入后的執行過程
（1）npm run dev是執行配置在package.json中的腳本
（2）調用了webpack配置文件
（3）配置文件中調用了main.js
（4）main.js用到了一個html元素#app，引用路由等開始vue的模板編譯
26、devDependencies和dependencies的區別
（1）devDependencies
用於本地開發，打包時生產環境不會打包這些依賴
（2）dependencies
開發環境能用，生產環境也能用。生產環境會被打包
27、依賴版本~和^的區別
（1）~
會匹配最近的小版本依賴包，比如~1.2.3會匹配所有1.2.x版本，但是不包括1.3.0
（2）^
會匹配最新的大版本依賴包，比如^1.2.3會匹配所有1.x.x的包，包括1.3.0，但是不包括2.0.0
28、插件機制
29、router的meta有什么用
在meta對象中可以設置一些狀態，通常設置標題或是否需要緩存。$route.meta.keepAlive/$route.meta.title
{
path:"/test",
name:"test",
component:()=>import("@/components/test"),
meta:{
title:"測試頁面", //配置title
keepAlive: true //是否緩存
}
}
30、如果子組件直接修改父組件的值會發生什么？怎么解決，要修改多個數據怎么辦？
如果修改的不是引用類型的值時會報錯，告訴我們不能直接修改父組件的值。
(1)可以使用.sync修飾符來修改值，對一個 prop 進行“雙向綁定”。（注意.sync 修飾符的 v-bind 不能和表達式一起使用）
(2)父組件將改變值的方法傳遞給子組件