前端面試題 (四) :

站在月亮上Da? ...


詳述組件通信

? ??????????父傳子 -?

????????????????在組件標(biāo)簽上通過自定義屬性的形式:list="item"綁定數(shù)據(jù),然后在子組件中通過props接收props:["list"]

示例:

//組件標(biāo)簽????-????父組件

????????<custom-select :list="item"></custom-select>

//子組件? ? -????接收

????????props: [ 'list' ],

子傳父? -??

????????在子組件中通過this.$emit('自定義事件名稱', '要傳遞的數(shù)據(jù)'),完成子組件配置

????????在子組件的組件標(biāo)簽上通過@自定義事件名稱="事件處理函數(shù)",來完成父組件接收的任務(wù)

//子組件????-? ??

????????????發(fā)射this.$emit('receive', val)

????????????第一個參數(shù):“自定義事件名稱”;第二個參數(shù):你要傳遞的數(shù)據(jù)

//父組件????-????接收??

? ??????<list @receive="changeVal"></list>

兄弟

????????????可以借助于父組件作為中轉(zhuǎn)完成通信 子 > 父 > 子? ?( 不過特別麻煩 )

中央通信

????????在要傳遞數(shù)據(jù)的組件通過$emit(自定義事件名稱,要傳遞的數(shù)據(jù))

// select - listi

mportbusfrom'../../main'

selectVal (val) {? ? ??

? ??bus.$emit('reveive', val)??

? }???????

在目標(biāo)組件通過$on進行監(jiān)聽接收$on('自定義事件名稱', 回調(diào)函數(shù))

// select - input

importbusfrom'../../main'

bus.$on('reveive', val => {

????????console.log(val)this.value = val?

})???

PS:$emit & $on都要掛載到Vue空實例上,而這個空實例要全局使用因此需要在main.js創(chuàng)建

// main.js

let? bus =newVue()

export default? bus?

keep-alive組件的作用

? ? ? ? ? ? ? ? 他是Vue內(nèi)置的一個組件 , 可以使被包含的組件保留狀態(tài),或避免重新渲染

? ? ? ? ? ? ? ? ( 也就是說 包裹動態(tài)組件,緩存不活動組件實列,但不銷毀它們 )


單頁面應(yīng)用和多頁面應(yīng)用區(qū)別及優(yōu)缺點

?單頁面用戶體驗好,內(nèi)容改變不用重新加載整個頁面,前后端分離,并且頁面特效比較炫酷,但是不利于seo,初次加載比較費時,頁面復(fù)雜度提高很多

多頁面? ?利于seo? 開發(fā)成本較低但是頁面重復(fù)代碼多,維護成本相對復(fù)雜,刷新方式 整頁刷新


什么是計算屬性?什么情況使用?

?vue 的 計算屬性??computed

官方文檔對計算屬性的描述是:

模板內(nèi)的表達式非常便利,但是設(shè)計它們的初衷是用于簡單運算的。在模板中放入太多的邏輯會讓模板過重且難以維護。所以,對于任何復(fù)雜邏輯,你都應(yīng)當(dāng)使用計算屬性。

你可以像綁定普通屬性一樣在模板中綁定計算屬性。Vue 知道?vm.reversedMessage?依賴于?vm.message,因此當(dāng)?vm.message?發(fā)生改變時,所有依賴?vm.reversedMessage?的綁定也會更新。而且最妙的是我們已經(jīng)以聲明的方式創(chuàng)建了這種依賴關(guān)系:計算屬性的 getter 函數(shù)是沒有副作用 (side effect) 的,這使它更易于測試和理解。


computed、methods的區(qū)別

? ??????????????他們得到最終結(jié)果是完全相同的,不同的是 computed 它 依賴于進行緩存,至于相關(guān)依賴發(fā)生關(guān)系才會改變他們重新求值,而methods則出發(fā)重新渲染,調(diào)用方法會再次執(zhí)行函數(shù)


查看更多...

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

友情鏈接更多精彩內(nèi)容