1.使用slot 技术实现如下只有三个标签页的组件，)2.其中每个标签页内容都是一个不同的组件( 3.然后点击不同标题会切换不同的组件显示。提示: 你应该写四个组件，三个标签页组件，一个包含所有标签页的最外层组件。-

好的，这个需求可以通过Vue.js来实现。下面是一个简单的实现方式：

首先，我们需要创建一个最外层的组件 `TabComponent`，用来包含所有的标签页组件。这个组件需要有一个属性 `activeTab`，用来记录当前选中的标签页。然后，我们需要在这个组件中定义三个子组件，分别是 `Tab1Component`、`Tab2Component` 和 `Tab3Component`。

接下来，我们需要在 `TabComponent` 组件中使用 `v-if` 指令来控制子组件的显示。当 `activeTab` 的值为 1 时，显示 `Tab1Component`，当 `activeTab` 的值为 2 时，显示 `Tab2Component`，当 `activeTab` 的值为 3 时，显示 `Tab3Component`。同时，我们需要在模板中定义三个按钮，用来切换不同的标签页。

最后，我们需要在 `TabComponent` 组件中定义一个 `changeTab` 方法，用来改变 `activeTab` 的值，从而实现标签页的切换。具体实现代码如下：

<template>
  <div>
    <button @click="changeTab(1)">Tab 1</button>
    <button @click="changeTab(2)">Tab 2</button>
    <button @click="changeTab(3)">Tab 3</button>
    <div>
      <Tab1Component v-if="activeTab === 1" />
      <Tab2Component v-if="activeTab === 2" />
      <Tab3Component v-if="activeTab === 3" />
    </div>
  </div>
</template>

<script>
import Tab1Component from './Tab1Component.vue'
import Tab2Component from './Tab2Component.vue'
import Tab3Component from './Tab3Component.vue'

export default {
  components: {
    Tab1Component,
    Tab2Component,
    Tab3Component
  },
  data() {
    return {
      activeTab: 1
    }
  },
  methods: {
    changeTab(tabIndex) {
      this.activeTab = tabIndex
    }
  }
}
</script>

这样，我们就实现了一个简单的标签页组件，可以通过点击不同的按钮来切换不同的标签页。