Vue 是一款流行的 JavaScript 框架，能夠輕松地構建動態、交互式的 Web 應用程序。Vue 提供了許多有用的組件來簡化 Web 應用程序的開發，其中一個重要的組件就是 Tab 切換。

在 Vue 中，我們可以使用 Vue 的指令來快速創建 Tab 切換。以下是一個基本的 Tab 切換示例：

<template>
<div>
<ul>
<li :class="{ active: activeTab === 'tab1' }" @click="activeTab = 'tab1'">Tab 1</li>
<li :class="{ active: activeTab === 'tab2' }" @click="activeTab = 'tab2'">Tab 2</li>
<li :class="{ active: activeTab === 'tab3' }" @click="activeTab = 'tab3'">Tab 3</li>
</ul>
<div v-show="activeTab === 'tab1'">Tab 1 Content</div>
<div v-show="activeTab === 'tab2'">Tab 2 Content</div>
<div v-show="activeTab === 'tab3'">Tab 3 Content</div>
</div>
</template>
<script>
export default {
data() {
return {
activeTab: 'tab1'
}
}
}
</script>

在上面的代碼中，我們使用了 Vue 的條件渲染(v-show)和綁定樣式(:class)指令來生成 Tab 切換。當您單擊標簽時，該標簽將被激活，并且相應的 Tab 內容將顯示。

這是一個非常基本的 Tab 切換，您可以根據您的需求添加更多的 Tab。此外，您還可以自定義 Tab 切換的樣式，使其與您的應用程序主題匹配。