Vue.js是一個前端框架，可以創建動態的用戶界面。組件是Vue.js中重要的概念之一，它是將一個大的應用程序劃分為獨立的可重用的部分。Vue.js提供了多種組件跳轉的方式，本文將介紹其中兩種常用的方式。

第一種方式是使用Vue Router，Vue Router是Vue.js官方的路由管理器，可以方便地實現單頁應用。首先，需要安裝Vue Router，可以在終端中使用以下命令進行安裝：

npm install vue-router

安裝完成后，在main.js文件中引入Vue Router：

import VueRouter from 'vue-router'

接著，定義路由并創建router實例：

const routes = [
{
path: '/home',
component: Home
},
{
path: '/about',
component: About
}
]
const router = new VueRouter({
routes
})

以上代碼定義了兩個路由，分別對應/home和/about路徑，分別引用了Home和About組件。接下來，需要將router實例注入到Vue實例中：

new Vue({
router,
render: h =>h(App),
}).$mount('#app')

在需要跳轉的組件中，可以使用router-link組件進行跳轉：

<router-link to="/home">Home</router-link>
<router-link to="/about">About</router-link>

第二種方式是使用$router對象進行跳轉。在組件中，可以通過this.$router.push方法進行跳轉，例如：

methods: {
goToHome() {
this.$router.push('/home')
},
goToAbout() {
this.$router.push('/about')
}
}

以上代碼在組件中定義了goToHome和goToAbout兩個方法，可以通過點擊按鈕等事件觸發$router.push方法進行跳轉。

總結

Vue.js提供了多種組件跳轉的方式，使用Vue Router可以方便地實現單頁應用。如有其他疑問，請查看Vue.js官方文檔。