<script lang="ts" setup name="ButtonBox"> import { ref } from 'vue' const emits = defineEmits(['changeCurrentButton']) const menu = [ { name: '全部', id: '0' }, { name: '草稿箱', id: '1' }, { name: '待审批', id: '2' }, { name: '审批中', id: '3' }, { name: '已通过', id: '4' }, { name: '未通过', id: '5' }, { name: '已取消', id: '6' }, ] const current = ref('0') watch(current, (newValue) => { emits('changeCurrentButton', newValue) }) </script> <template> <div class="container"> <div class="btns"> <!-- 三级菜单 --> <el-radio-group v-model="current"> <el-radio-button v-for="item in menu" :key="item.id" :label="item.id"> {{ item.name }} </el-radio-button> </el-radio-group> </div> <!-- 展示区域 --> <!-- <component :is="currentComp" /> --> </div> </template> <style lang="scss" scoped> .container { position: relative; .btns { position: fixed; top: 69px; right: 15px; z-index: 999; } } </style>