1：說一下vue的緩存keep-alive空执，并說出當(dāng)一個(gè)頁(yè)面被緩存后要走哪些生命周期鉤子

? ? ? ? 1，把切換出去的組件保留在內(nèi)存中穗椅，可以保留它的狀態(tài)或避免重新渲染辨绊。

? ? ? ? 2、<keep-alive>是抽象組件匹表，它自身不會(huì)渲染DOM元素门坷，也不會(huì)出現(xiàn)在父組件鏈中宣鄙。

? ? ? ? 3、當(dāng)組件在 <keep-alive> 內(nèi)被切換默蚌，它的 activated 和 deactivated 這兩個(gè)生命周期鉤子函數(shù)將會(huì)被對(duì)應(yīng)執(zhí)行冻晤。

? ? ? 注：在 2.2.0 及其更高版本中，activated 和 deactivated 將會(huì)在 <keep-alive> 樹內(nèi)的所有嵌套組件中觸發(fā)绸吸。

使用keepAlive后生命周期：

????????首次進(jìn)入緩存頁(yè)面：beforeRouteEnter --> created --> mounted --> activated --> deactivated

????????再次進(jìn)入緩存頁(yè)面：beforeRouteEnter --> activated --> deactivated

????????注：

????????????????1鼻弧、這里的activated非常有用，因?yàn)轫?yè)面被緩存時(shí)惯裕，created,mounted等生命周期均失效温数，你若想進(jìn)行一些操作，那么可以在activated內(nèi)完成(下面會(huì)舉個(gè)栗子：列表頁(yè)回到上次瀏覽位置)

????????????????2蜻势、activated? keep-alive組件激活時(shí)調(diào)用撑刺，該鉤子在服務(wù)器端渲染期間不被調(diào)用。 3握玛、deactivated? keep-alive組件停用時(shí)調(diào)用够傍，該鉤子在服務(wù)端渲染期間不被調(diào)用。

2：跨域產(chǎn)生的原因和如何解決（什么是跨域挠铲？跨域產(chǎn)生原因與解決方法 – 余浩的博客）

原因：同源政策（擴(kuò)展 ：1冕屯、協(xié)議相同? 2、域名相同 3拂苹、端口相同同源策略目的 目的：保證用戶信息安全安聘，防止惡意網(wǎng)站竊取數(shù)據(jù)。同源策略是必須的瓢棒，否則cookie可以共享）是瀏覽器的一種安全機(jī)制浴韭，服務(wù)端之間是不存在跨域的

解決：1：跨域資源共享cors解決跨域??

? ? ? ? ? ? 2：nginx反向代理解決跨域（前端常用）

? ? ? ? ? ? 3：添加響應(yīng)頭解決跨域

? ? ? ? ? ? 4：通過jsonp解決跨域（老方法）

3：VUE路由的兩種模式

? ? ? ? 1：hash模式：鏈接中帶有#號(hào)，#號(hào)后面的不被后臺(tái)獲取脯宿，#號(hào)前面的地址一直不變念颈，http沒有獲取到新的地址，就不會(huì)去訪問后臺(tái)數(shù)據(jù)庫(kù)连霉，避免了因?yàn)榈刂犯淖兌l繁的訪問后臺(tái)

? ? ? ? 2：history模式：具有對(duì)url歷史記錄進(jìn)行修改的功能

? ? ? ? 比較：hash模式很多場(chǎng)景不適用榴芳，比如微信的微信支付 ，對(duì)找不到的頁(yè)面不做任何處理跺撼，（切換：mode:’history’）

????????????????????history模式窟感，找不到的頁(yè)面會(huì)出現(xiàn)404錯(cuò)誤，這個(gè)錯(cuò)誤是要由后臺(tái)去進(jìn)行處理的（切換：mode:’hash’）

4：說一下插槽和具體用法

? ? ? ? 定義：插槽就是子組件中的提供給父組件使用的一個(gè)占位符歉井，用<slot></slot> 表示柿祈，父組件可以在這個(gè)占位符中填充任何模板代碼

? ? ? ? 基本語法：子組件B中添加一個(gè)<slot></slot>，在父組件的子組件引用中寫上需要添加的內(nèi)容

? ? ? ? 分類

? ? ? ? ? ? 1：具名插槽：定義一個(gè)name（子組件：<slot name="myslot"></slot>），將對(duì)應(yīng)內(nèi)容插在有相同name的template上（父組件<B><template v-slot:myslot></template></B>）

? ? ? ? ? ? 2：作用域插槽：子組件谍夭，（<slot:item="item"></slot）黑滴。父組件，（<B><template v-slot:default="slotProps"></template></B>）紧索。父組件中的slotProps可以自定義名稱袁辈，接收來自子組件的傳參item（動(dòng)態(tài)接收數(shù)據(jù)的寫法：v-slot:[dynamicSlotName]）

5：兄弟組件之間的傳信

? ? ? ? ? ? 1：事件總線EventBus（在Vue中使用EventBus，你應(yīng)該知道這些細(xì)節(jié)珠漂！ - 掘金）（插件晚缩，也可直接安裝插件npm install vue-bus --saveVue中 事件總線（eventBus）詳解及使用_明天也要努力的博客-CSDN博客_vue中的事件總線）

? ? ? ? ? ? 2：使用vuex（如何使用vuex實(shí)現(xiàn)兄弟組件通信 - 博客 - 編程圈）

6：如何理解父子組件的生命周期

父組件：beforeCreate——created——beforeMounted——子組件beforeCreate——created——beforeMounted——mounted——父組件mounted——beforeUpdate——子組件beforeUpdate——updeted——父組件updated——beforeDestroy——子組件beforeDestroy——destroyed——父detroyed

7：