Vue-router是伴隨著Vue框架出現(xiàn)的路由系統(tǒng)，它也是公認(rèn)的一種優(yōu)秀的路由解決方案。在使用Vue-router時(shí)候，我們常常會(huì)使用其自帶的路徑跳轉(zhuǎn)組件Link,通過(guò)<Link to="path"></Link>實(shí)現(xiàn)跳轉(zhuǎn)，這和傳統(tǒng)的<a href="path"></a>何其相似！但它們到底有什么具體的區(qū)別呢？

對(duì)比<a>，Link組件避免了不必要的重渲染

A -- 通過(guò)<a>標(biāo)簽實(shí)現(xiàn)頁(yè)面跳轉(zhuǎn)：（圖中的例子將會(huì)在下面詳細(xì)解答）

圖一

圖二

圖三

B --通過(guò)<Link>組件實(shí)現(xiàn)頁(yè)面跳轉(zhuǎn)：

圖一

圖二

只更新變化的部分從而減少DOM性能消耗

• Vue的創(chuàng)新之處在于，它利用虛擬DOM的概念和diff算法實(shí)現(xiàn)了對(duì)頁(yè)面的"按需更新"，Vue-router很好地繼承了這一點(diǎn)，譬如上圖所示，導(dǎo)航組件和三個(gè)Tab組件（通過(guò)...,通過(guò)...,通過(guò)...）的重渲染是我們不希望看到的，因?yàn)闊o(wú)論跳轉(zhuǎn)到頁(yè)面一或是頁(yè)面二，它只需要渲染一次就夠了。<Link>組件幫助我們實(shí)現(xiàn)了這個(gè)愿望，反觀<a>標(biāo)簽，每次跳轉(zhuǎn)都重渲染了導(dǎo)航組件和Tab組件試想一下，在一個(gè)浩大的項(xiàng)目里，這多么可怕！我們的"渲染"做了許多"無(wú)用功"，而且消耗了大量彌足珍貴的DOM性能！