I'm a beginner with vue.js and currently working with the <NavigationMenuTrigger/> component from 'radix-vue'
Essentially, this component triggers the menu to open when hovered over, and closes it when hovered outside.
My goal is to disable both the trigger on hover and closing when clicked or hovered outside.
I attempted the following code:
const disabled = true;
const forwardedProps = useForwardProps(delegatedProps)
</script>
<template>
<NavigationMenuTrigger
:disableHoverTrigger = "disabled"
:disableOutsidePointerEvents = "disabled"
v-bind="forwardedProps"
:class="cn(navigationMenuTriggerStyle(), 'group', props.class)"
>
<slot />
<ChevronDown
class="relative top-px ml-1 h-3 w-3 transition duration-200 group-data-[state=open]:rotate-180"
aria-hidden="true"
/>
</NavigationMenuTrigger>
</template>
However, for some unknown reason, it isn't functioning as expected.