vue2 elementui标签页

在 Vue 2 中使用 Element UI 的标签页组件的方法与上述示例类似，但需要安装适合 Vue 2 的 Element UI 版本。

首先，在你的项目中安装 Element UI 的 Vue 2 版本：

npm install element-ui@2.15.1

然后，在你的入口文件（通常是 `main.js`）中引入 Element UI 的样式和组件：

import Vue from 'vue';import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';

Vue.use(ElementUI);

现在，你可以在你的 Vue 组件中使用标签页组件了。以下是一个示例代码：

<template>
  <div>
    <el-tabs v-model="activeTab">
      <el-tab-pane label="Tab 1" name="tab1">
        Content of Tab 1
      </el-tab-pane>
      <el-tab-pane label="Tab 2" name="tab2">
        Content of Tab 2
      </el-tab-pane>
      <el-tab-pane label="Tab 3" name="tab3">
        Content of Tab 3
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
export default {
  data() {
    return {
      activeTab: 'tab1'
    };
  }
};
</script>

在这个示例中，我们同样使用了 `el-tabs` 组件来创建标签页，每个标签页使用 `el-tab-pane` 组件表示。通过 `v-model` 来绑定当前选中的标签页，可以通过修改 `activeTab` 的值来切换标签页。

请注意，Element UI 的 Vue 2 版本与 Vue 3 版本略有不同，所以需要确保你安装的是适合 Vue 2 的版本。另外，如果你使用 Vue CLI 创建的项目，你可以通过在安装 Element UI 时选择对应的 Vue 版本来简化配置过程：

vue create my-project

cd my-project

vue add element

这样就可以自动安装适合 Vue 2 的 Element UI，并进行相关配置。

希望这可以帮助到你！如果还有其他问题，请随时提问。