2021-03-07
<meta charset="utf-8">
一. 請談?wù)刅ue中的MVVM模式
MVVM全稱是Model-View-ViewModel
Vue是以數(shù)據(jù)為驅(qū)動的，Vue自身將DOM和數(shù)據(jù)進(jìn)行綁定晤锹，一旦創(chuàng)建綁定鞭铆，DOM和數(shù)據(jù)將保持同步，每當(dāng)數(shù)據(jù)發(fā)生變化衔彻，DOM會跟著變化。 ViewModel是Vue的核心澄港，它是Vue的一個實(shí)例柄沮。Vue實(shí)例時作用域某個HTML元素上的這個HTML元素可以是body废岂，也可以是某個id所指代的元素狱意。
DOMListeners和DataBindings是實(shí)現(xiàn)雙向綁定的關(guān)鍵。DOMListeners監(jiān)聽頁面所有View層DOM元素的變化财骨，當(dāng)發(fā)生變化藏姐，Model層的數(shù)據(jù)隨之變化；DataBindings監(jiān)聽Model層的數(shù)據(jù)捌臊，當(dāng)數(shù)據(jù)發(fā)生變化兜材，View層的DOM元素隨之變化。
二. v-show和v-if指令的共同點(diǎn)和不同點(diǎn)?
-
v-show指令是通過修改元素的displayCSS屬性讓其顯示或者隱藏 -
v-if指令是直接銷毀和重建DOM達(dá)到讓元素顯示和隱藏的效果
三. 如何讓CSS只在當(dāng)前組件中起作用?
將當(dāng)前組件的<style>修改為<style scoped>
四. <keep-alive></keep-alive>的作用是什么?
<keep-alive></keep-alive> 包裹動態(tài)組件時糠爬，會緩存不活動的組件實(shí)例,主要用于保留組件狀態(tài)或避免重新渲染卵皂。
大白話: 比如有一個列表和一個詳情砚亭，那么用戶就會經(jīng)常執(zhí)行打開詳情=>返回列表=>打開詳情…這樣的話列表和詳情都是一個頻率很高的頁面捅膘，那么就可以對列表組件使用<keep-alive></keep-alive>進(jìn)行緩存，這樣用戶每次返回列表的時候寻仗，都能從緩存中快速渲染，而不是重新渲染
五. Vue中引入組件的步驟?
1.采用ES6的import ... from ...語法或CommonJS的require()方法引入組件
2.對組件進(jìn)行注冊,代碼如下
// 注冊
Vue.component('my-component', {
template: '<div>A custom component!</div>'
})
3.使用組件<my-component></my-component>
六. 指令v-el的作用是什么?
提供一個在頁面上已存在的 DOM 元素作為 Vue 實(shí)例的掛載目標(biāo).可以是 CSS 選擇器耙替，也可以是一個 HTMLElement 實(shí)例,
七. 在Vue中使用插件的步驟
- 采用ES6的
import ... from ...語法或CommonJSd的require()方法引入插件 - 使用全局方法
Vue.use( plugin )使用插件,可以傳入一個選項(xiàng)對象Vue.use(MyPlugin, { someOption: true })
八. 請列舉出3個Vue中常用的生命周期鉤子函數(shù)?
-
created: 實(shí)例已經(jīng)創(chuàng)建完成之后調(diào)用,在這一步,實(shí)例已經(jīng)完成數(shù)據(jù)觀測, 屬性和方法的運(yùn)算, watch/event事件回調(diào). 然而, 掛載階段還沒有開始,
$el屬性目前還不可見 -
mounted:
el被新創(chuàng)建的vm.$el替換俗扇，并掛載到實(shí)例上去之后調(diào)用該鉤子箕别。如果root實(shí)例掛載了一個文檔內(nèi)元素滞谢，當(dāng) mounted 被調(diào)用時vm.$el也在文檔內(nèi)除抛。 -
activated::
keep-alive組件激活時調(diào)用
九. 請簡述下Vuex的原理和使用方法
一個應(yīng)用可以看作是由上面三部分組成: View, Actions,State,數(shù)據(jù)的流動也是從View => Actions => State =>View 以此達(dá)到數(shù)據(jù)的單向流動.但是項(xiàng)目較大的, 組件嵌套過多的時候, 多組件共享同一個State會在數(shù)據(jù)傳遞時出現(xiàn)很多問題.Vuex就是為了解決這些問題而產(chǎn)生的.
Vuex可以被看作項(xiàng)目中所有組件的數(shù)據(jù)中心,我們將所有組件中共享的State抽離出來,任何組件都可以訪問和操作我們的數(shù)據(jù)中心.
上圖可以很好的說明Vuex的組成,一個實(shí)例化的Vuex.Store由state, mutations和actions三個屬性組成:
- state中保存著共有數(shù)據(jù)
- 改變state中的數(shù)據(jù)有且只有通過mutations中的方法,且mutations中的方法必須是同步的
- 如果要寫異步的方法,需要些在actions中, 并通過commit到mutations中進(jìn)行state中數(shù)據(jù)的更改.
更多Vuex信息,請參考Vuex官網(wǎng) : vuex.vuejs.org
十. 請談?wù)刅ue框架和Angular.js和React的不同
參見:Vue對比其他框架
作者：EduMedia_熠輝
鏈接：http://www.reibang.com/p/e54a9a34a773
來源：簡書
著作權(quán)歸作者所有橄教。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán)喘漏，非商業(yè)轉(zhuǎn)載請注明出處。
