p14 vue高頻面試題-2

Vue如何實現(xiàn)單頁面應用？

通常url的組成部分有：協(xié)議名、域名、端口號、路徑、參數(shù)、哈希值，當哈希值改變，頁面不會發(fā)生跳轉，單頁面應用就是利用這一點，給window注冊onhashchange事件，當哈希值改變時通過location.hash就能獲得相應的哈希值，然后就能跳到相應的頁面

hash通過監(jiān)聽瀏覽器的onhashchange()事件變化，查找對應的路由規(guī)則

history原理：利用h5的history中新增的兩個api pushState()和replaceState()和一個事件的onpopstate監(jiān)聽URL的變化

$router和$route的區(qū)別？

$router是用來操作路由的，是VueRouter的實例，可以跳轉頁面，使用push、replace等跳轉方法可以實現(xiàn)頁面的跳轉，其中push方法是可以跳轉并且還可以回退的，replace方法可以跳轉但是不能回退，因為replace方法會把跳轉前的地址清楚掉，導致回退不了。

$route是用來獲取路由信息參數(shù)的，它是路由信息的一個對象，里面包含一些基本信息，有name、meta、path、hash、query、params、fullPath、matched等。

兩者實現(xiàn)的東西完全不一樣的。

Vue中怎么定義自定義過濾器（vue3不支持）？

用filter來定義過濾器，過濾器分為全局和局部過濾器，過濾器就是一個普通的函數(shù)，來對數(shù)據進行處理，可以傳遞參數(shù)，當有局部和全局兩個名稱相同的過濾器時，以就近原則進行調用，也就是局部過濾器優(yōu)先于全局過濾器。

過濾器例子 {{ data | formatTime}}左邊過濾的變量，右邊為過濾器的名字

全局定義過濾器：

Vue.filter('formatTime',(val, format) => {

?????return moment(val).format(format)

???})

局部定義過濾器：

filters: {

formatTime(val, format) {

??????return moment(val).format(format)

?????}

????}