Vue是一個極具可擴展性的JavaScript框架，它能夠創建響應式及可重用的用戶組件。Vue能夠讓你以更加直觀的方式創建展現層的用戶界面。因此，Vue app界面的開發變得更加簡單明了。

當你使用Vue創建一個app時，它的用戶界面通常被分成許多組件，每個組件都有它自己的視圖模板、JavaScript業務邏輯和CSS樣式表。一個組件可能會包含其它組件，因此一個app可以描述為一個大的組件樹形結構。

// Vue app組件
Vue.component('app', {
template: `<div>
<navigation-menu />
<router-view />
</div>`
});
// navigation-menu組件
Vue.component('navigation-menu', {
template: `<div>
<nav>
<h1>Title</h1>
<ul>
<li><a href="#">Link1</a></li>
<li><a href="#">Link2</a></li>
<li><a href="#">Link3</a></li>
</ul>
</nav>
</div>`
});
// router-view組件
Vue.component('router-view', {
template: `<div>
<router-link to="/home">Home</router-link>
<router-link to="/about">About</router-link>
<router-link to="/contact">Contact</router-link>
<router-view />
</div>`
});

這里我們可以看到，app組件包含了navigation-menu和router-view兩個子組件。navigation-menu呈現出一個包含三個超鏈接的導航欄，而router-view是一個帶有路由功能的區域，用于展示不同頁面的內容。

當用戶在Vue app中切換路由時，router-view會根據當前路由的路徑動態地呈現不同的頁面組件。每個頁面組件擁有自己的視圖模板、JavaScript業務邏輯和CSS樣式表。你可以利用路由功能來構建一個SPA（單頁應用），讓用戶能夠在頁面之間流暢切換，而無需每次都加載全部的頁面資源。