<template> <div class="publicContainer partitionTarget"> <el-tabs v-model="activeName"> <el-tab-pane label="一级管控分区" name="firstLevel" /> <el-tab-pane label="二级管控分区" name="secondLevel" /> <el-tab-pane label="三级管控分区" name="threeLevel" /> </el-tabs> <component :is="comps[activeName]"></component> </div> </template> <script setup> import firstLevel from '../components/firstLevel.vue'; import secondLevel from '../components/secondLevel.vue'; import threeLevel from '../components/threeLevel.vue'; const activeName = ref('firstLevel'); const comps = { firstLevel: markRaw(firstLevel), secondLevel: markRaw(secondLevel), threeLevel: markRaw(threeLevel), }; </script> <style lang="scss" scoped></style>