關於vue.js的部分總結

1.MVVM和MVC的區別:    MVVM:是Model-View-ViewModel的簡寫,即模型-視圖-視圖模型    模型:後端傳遞的數據    試圖:所看到的頁面    視圖模型:mvvm模式的核心,它是鏈接view和model的橋樑。    兩個實現方向:        1)模型===》視圖:後端傳遞的數據轉化成所看到的頁面,實現方式(數據綁定)        2)視圖===》模型:即將所看到的頁面轉化成後端的數據,實現的方式是(DOM 事件監聽)    MVC:MVC是Model-View-Controller的簡寫,即模型-視圖-控制器    controller指的是頁面業務邏輯,使用MVC的目的就是將M和V代碼分離    使用MVVM模式有幾大好處:           1). 低耦合。View能夠獨立於Model變化和修改,一個ViewModel能夠綁定到不一樣的View上,當View變化的時候Model能夠不變,當Model變化的時候View也能夠不變。          2). 可重用性。能夠把一些視圖的邏輯放在ViewModel裏面,讓不少View重用這段視圖邏輯。          3). 獨立開發。開發人員能夠專一與業務邏輯和數據的開發(ViewModel)。設計人員能夠專一於界面(View)的設計。          4). 可測試性。能夠針對ViewModel來對界面(View)進行測試2.vue的生命週期    八個:建立前、建立後、載入前、載入後、更新前、更新後、銷燬前、銷燬後    生命週期的做用:讓咱們在控制整個Vue實例的過程時更容易造成好的邏輯    DOM 渲染在 載入後(mounted) 中就已經完成了。3.vue實現雙向綁定原理    vue實現數據雙向綁定主要是:採用數據劫持結合發佈者-訂閱者模式的方式,經過Object.defineProperty()    來劫持各個屬性的setter,getter,在數據變更時發佈消息給訂閱者,觸發相應監聽回調。4.Vue組件間的參數傳遞    1)父組件與子組件傳值        父===》子:子組件經過props方法接受數據;        子===》父:子組件經過$emit方法傳遞參數,觸發父組件event    2)非父子組件間的數據傳遞,兄弟組件傳值        eventBus,就是建立一個事件中心,至關於中轉站,能夠用它來傳遞事件和接收事件        VUEX項目較大時5.Vue與React的區別6.vue路由的鉤子函數    首頁能夠控制導航跳轉,beforeEach,afterEach等,通常用於頁面title的修改。    一些須要登陸才能調整頁面的重定向功能。    beforeEach主要有3個參數to、from、next    to:route即將進入的目標路由對象    from:route當前導航正要離開的路由    next:function必定要調用該方法resolve這個鉤子。執行效果依賴next方法的調用參數。能夠控制網頁的跳轉。    全局導航鉤子:    router.beforeEach(to, from, next),    router.beforeResolve(to, from, next),    router.afterEach(to, from ,next)    組件內鉤子:    beforeRouteEnter,    beforeRouteUpdate,    beforeRouteLeave    單獨路由獨享組件:    beforeEnter7.vuex是什麼?怎麼使用?哪一種功能場景使用它?    只用來讀取的狀態集中放在store中; 改變狀態的方式是提交mutations,這是個同步的事物; 異步邏輯應該封裝在action中。    在main.js引入store,注入。新建了一個目錄store,….. export 。    場景有:單頁應用中,組件之間的狀態、音樂播放、登陸狀態、加入購物車    vuex 的mutation和action的特性是什麼?有什麼區別?        mutation用於修改state的數據,是同步的。        action 相似於 muation, 不一樣在於:action 提交的是 mutation,而不是直接變動狀態        action 能夠包含任意異步操做8.css只在當前組件起做用    在style標籤中寫入scoped便可:<style scoped></style>9.v-if 和 v-show 區別    v-if按照條件是否渲染,v-show是display的block或none    v-show的值不管爲true或false,元素都會存在與html代碼中,而只有當v-if的值爲true,元素纔會存在HTML中    v-show指令只是設置了元素css的style值10.$route和$router的區別    $route是「路由信息對象」,包括path,params,hash,query,fullPath,matched,name等路由信息參數    $router是「路由實例」對象包括了路由的跳轉方法,鉤子函數等11.vue.js的兩個核心是什麼?vue幾種經常使用的指令?    數據驅動、組件系統    指令:v-for、v-if、v-bind、v-on、v-show、v-else12.vue經常使用的修飾符?    prevent:提交事件再也不重載頁面    stop:阻止事件冒泡    self:當事件發生在該元素自己而不是子元素的時候會觸發    capture:事件偵聽,事件發生的時候會調用13.對keep-alive的瞭解    keep-alive是 Vue 內置的一個組件,可使被包含的組件保留狀態,或避免從新渲染。    keep-alive加入了兩個屬性:include(包含的組件緩存) 與 exclude(排除的組件不緩存,優先級大於include)        <keep-alive include='include_components' exclude='exclude_components'>            <component>                 <!-- 該組件是否緩存取決於include和exclude屬性 -->            </component>        </keep-alive>    參數解釋:    include - 字符串或正則表達式,只有名稱匹配的組件會被緩存    exclude - 字符串或正則表達式,任何名稱匹配的組件都不會被緩存    include 和 exclude 的屬性容許組件有條件地緩存。兩者均可以用「,」分隔字符串、正則表達式、數組。當使用正則或者是數組時,要記得使用v-bind 。13.vue.js是什麼?    是一套構建用戶界面的 漸進式框架。與其餘重量級框架不一樣的是,Vue 採用自底向上增量開發的設計。    Vue 的核心庫只關注視圖層,而且很是容易學習,很是容易與其它庫或已有項目整合。另外一方面,    Vue 徹底有能力驅動採用單文件組件和Vue生態系統支持的庫開發的複雜單頁應用。    Vue.js 的目標是經過儘量簡單的 API 實現響應的數據綁定和組合的視圖組件14.vue.js特性    MVVM、組件化、指令系統、支持虛擬DOM    虛擬dom:虛擬DOM是用Object來表明一顆節點,這個Object叫作VNode,而後使用兩個VNode進行對比,根據對比後的結果修改真實DOM。             每次渲染都會生成一個新的VNode,而後和上一次渲染時用的VNode進行對比。而後將這一次新生成的VNode緩存,用來進行下一次對比。    虛擬dom的缺點:    1. 代碼更多,體積更大    2. 內存佔用增大    3. 小量的單一的dom修改使用虛擬dom成本反而更高,不如直接修改真實dom快15.vue.js的特色    簡潔:頁面由HTML模板+Json數據+Vue實例組成    數據驅動:自動計算屬性和追蹤依賴的模板表達式    組件化:用可複用、解耦的組件來構造頁面    輕量:代碼量小,不依賴其餘庫    快速:精確有效批量DOM更新    模板友好:可經過npm,bower等多種方式安裝,很容易融入16.Vue 項目時爲何要在組件中寫 key,其做用是什麼?    在開發過程當中,咱們須要保證某個元素的 key 在其同級元素中具備惟一性。    在 Diff 算法中 會藉助元素的 Key 值來判斷該元素是新近建立的仍是被移動而來的元素,    從而減小沒必要要的元素重渲染。17.computed 和 watched 的區別:   computed 是計算屬性,依賴其餘屬性計算值,而且 computed 的值有緩存,只有當計算值變化纔會返回內容。   watch 監聽到值的變化就會執行回調,在回調中能夠進行一些邏輯操做。18.axios是什麼?怎麼使用?描述使用它實現登陸功能的流程?   請求後臺資源的模塊。npm install axios -S裝好,而後發送的是跨域,需在配置文件中config/index.js進行設置。   後臺若是是Tp5則定義一個資源路由。js中使用import進來,而後.get或.post。返回在.then函數中若是成功,   失敗則是在.catch函數中
相關文章
相關標籤/搜索