Files
Aether/frontend/src/components/ui/tabs.vue
2025-12-10 20:52:44 +08:00

36 lines
686 B
Vue

<template>
<div class="tabs-root">
<slot />
</div>
</template>
<script setup lang="ts">
import { provide, ref, watch } from 'vue'
interface Props {
defaultValue?: string
modelValue?: string
}
const props = defineProps<Props>()
const emit = defineEmits<{
'update:modelValue': [value: string]
}>()
const activeTab = ref(props.modelValue || props.defaultValue || '')
watch(() => props.modelValue, (newValue) => {
if (newValue !== undefined) {
activeTab.value = newValue
}
})
const setActiveTab = (value: string) => {
activeTab.value = value
emit('update:modelValue', value)
}
provide('activeTab', activeTab)
provide('setActiveTab', setActiveTab)
</script>