欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

elementui 中tab切换

程序员文章站 2022-06-07 11:07:01
...
 <el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane label="工业用户" name="0">
          <Industrial v-if="activeName == 0" :gas-type="3"></Industrial>
        </el-tab-pane>
        <el-tab-pane label="商业用户" name="1">
          <Commerce v-if="activeName == 1"></Commerce>
        </el-tab-pane>
        <el-tab-pane label="民用用户" name="2">
          <Civil v-if="activeName == 2"></Civil>
        </el-tab-pane>
        <el-tab-pane label="煤改气用户" name="3">
          <Gas v-if="activeName == 3"></Gas>
        </el-tab-pane>
      </el-tabs>
export default {
  components: { Civil, Commerce, Industrial, Gas },
  data() {
    return {
      activeName: '0'
    }
  },
  methods: {
    handleClick(tab) {
      this.activeName = tab.index
    }
  }
}
</script>