1.vue路由有幾種模式?有什么區(qū)別,以及原理?
vue的路由模式一共有兩種,分別是哈希和history,他們的區(qū)別是hash模式不會(huì)包含在http請(qǐng)求當(dāng)中,并且hash不會(huì)重新加載頁(yè)面,而使用history模式的話,如果前端的url和后端發(fā)起請(qǐng)求的url不一致的話,會(huì)報(bào)404錯(cuò)誤,所以history的原理是利用html5新增的兩個(gè)特性方法,分別是psuhState和replaceState來(lái)完成的,以上就是對(duì)vue路由的理解。
2.vue路由守衛(wèi)?
路由的導(dǎo)航守衛(wèi) 又叫做路由的鉤子函數(shù)(生命周期函數(shù))
就是在跳轉(zhuǎn)頁(yè)面的時(shí)候把路由欄下來(lái),做一些操作在放行,vue一共提供了三種路由守衛(wèi)。
第一種是全局守衛(wèi)
beforeEach路由進(jìn)入之前
afterEach路由進(jìn)入之后
第二種 組件內(nèi)守衛(wèi)
beforeRouteEnter 路由進(jìn)入之前
beforeRouteUpdate 路由更新之前
beforeRouteLeave 路由離開之前
第三種 路由獨(dú)享守衛(wèi)
beforeEnter 路由進(jìn)入之前
回調(diào)函數(shù)里面有三個(gè)參數(shù)
分別是 to from next
next 這個(gè)參數(shù) 在路由3.x版本的時(shí)候,是必須的
但是到了路由4.x版本的時(shí)候next參數(shù)變成可選的了
一般來(lái)說vue2搭配 3.x的路由
vue3搭配 4.x 的路由
比如說購(gòu)物車頁(yè)面只有登陸的才能訪問,我們可以用組件級(jí)守衛(wèi)購(gòu)物車頁(yè)面,如果已經(jīng)登陸存有token 的話,就繼續(xù)訪問這個(gè)頁(yè)面,如果沒有登陸的話就會(huì)跳轉(zhuǎn)到登陸頁(yè)面。
理解
在項(xiàng)?中我們經(jīng)常使?路由守衛(wèi)實(shí)現(xiàn)??的鑒權(quán). ?如:當(dāng)?戶登錄之后,我們會(huì)把后臺(tái)返回的token以及?戶信息保存到vuex
和本地,當(dāng)??進(jìn)?跳轉(zhuǎn)的時(shí)候,我們會(huì)在路由守衛(wèi)??獲取vuex??的token,如果token存在的話,我們則使?next讓他進(jìn)?要
跳轉(zhuǎn)的??,如果token不存在的話我們使?next?法讓他回到登錄?
以上就是我對(duì)vue路由守衛(wèi)的理解。
3.v-if和v-show的區(qū)別?
?先v-if和v-show都是控制元素的顯示與隱藏, 不過v-if控制元素的顯
示和隱藏的時(shí)候會(huì)刪除對(duì)?的dom元素,當(dāng)每?個(gè)顯示的時(shí)候,都會(huì)重新創(chuàng)建dom和渲染. ?v-show則是通過css的display:none
和display:block來(lái)控制元素的顯示與隱藏. v-if?較耗費(fèi)性能,所以我們涉及到頻繁的顯示隱藏操作我們建議使?v-show,如果不
是頻繁操作的話,我們可以v-if
在項(xiàng)?中我會(huì)經(jīng)常使?v-if和v-show,?如我們?cè)谒阉鞴δ艿臅r(shí)候,他有?個(gè)歷史記錄,這個(gè)時(shí)候我們根據(jù)是否有搜索的結(jié)果來(lái)判
斷歷史記錄的顯示與隱藏,這塊我就可以使?v-if ,當(dāng)然?v-show也可以. 以上就是我對(duì)v-if和v-show的理解。
4.v-for與v-if的優(yōu)先級(jí)那個(gè)??如果同時(shí)使?v-for和v-if怎么解決?
v-for的優(yōu)先級(jí)?. 因?yàn)関-for的時(shí)候我們才開始渲染dom元素,這個(gè)v-if還?法進(jìn)?判斷.
v-for和v-if不能同時(shí)使?,我們可以通過標(biāo)簽,?如div或者template標(biāo)簽來(lái)進(jìn)?包裹,把v-if寫到包裹的標(biāo)簽上?(寫到v-for外?)。
5. methods、computed和watch的區(qū)別?
?先呢,methods是?來(lái)定義?法的區(qū)域,methods定義的?法需要調(diào)?才能觸發(fā). 不具備緩存?
?computed是計(jì)算屬性,他依賴于屬性值的變化,當(dāng)屬性發(fā)?改變的時(shí)候,計(jì)算屬性??定義的?法就會(huì)觸發(fā),computed具有緩
存性,依賴屬性值的變化?變化.
?watch主要是?于監(jiān)聽,不具備被緩存性.依賴于數(shù)據(jù)變化?觸發(fā).
在項(xiàng)?中,?如我們獲取state的狀態(tài)的時(shí)候我們會(huì)把它放到computed??,或者在寫購(gòu)物?數(shù)量計(jì)算的時(shí)候也會(huì)使?計(jì)算屬性.
?watch也在項(xiàng)?經(jīng)常使?,?如我們封裝編輯 和 新增彈窗組件的時(shí)候會(huì)通過watch來(lái)進(jìn)?id判斷我們要顯否要清空表單的數(shù)
據(jù).
以上就是我對(duì)computed和watch的理解。