feat: add @click for tab pane

This commit is contained in:
Sebastian Zborowski
2023-03-31 12:01:09 +02:00
parent f34c086960
commit 4dbe3cc315

View File

@@ -9,6 +9,7 @@
:name="item.props?.name" :name="item.props?.name"
:disabled="item.props?.disabled" :disabled="item.props?.disabled"
:title="item.props?.title" :title="item.props?.title"
@click="emitClick"
/> />
</ul> </ul>
</div> </div>
@@ -46,7 +47,7 @@ const props = defineProps({
}, },
}) })
const emit = defineEmits(['update:modelValue']) const emit = defineEmits(['update:modelValue', 'click:pane'])
const { ulClasses, divClasses } = useTabsClasses(props) const { ulClasses, divClasses } = useTabsClasses(props)
@@ -71,11 +72,14 @@ const modelValueRef = computed({
provide(TAB_ACTIVE_NAME_INJECTION_KEY, modelValueRef) provide(TAB_ACTIVE_NAME_INJECTION_KEY, modelValueRef)
provide(TAB_VISIBILITY_DIRECTIVE_INJECTION_KEY, toRef(props, 'directive')) provide(TAB_VISIBILITY_DIRECTIVE_INJECTION_KEY, toRef(props, 'directive'))
const onActivate = (value: string) => { const onActivate = (value: string) => {
modelValueRef.value = value modelValueRef.value = value
} }
function emitClick(): void {
emit('click:pane')
}
provide(TAB_ACTIVATE_INJECTION_KEY, onActivate) provide(TAB_ACTIVATE_INJECTION_KEY, onActivate)
</script> </script>