Vue3 jak pokazać element on-hover na innym? Opcje

[phpamator]

Hellouuuuu,


Witam wszystkich.
Potrzebuję odrobiny wskazówek i wyjaśnienia jak to zrobić bo nie rozumiem zupełnie ....
Otóż, mam listę

[HTML] pobierz, plaintext 
 <li v-for="(link, key) in menu" :key="key,index" class="mb-2" ref="link.id" :data="link.parent_id" :class="link.type" :name="link.id" v-model="ItemIndex">
	<a 
		:href="link.url"
		class="text-white tracking-widest"
		@mouseenter="hoverLink(link.image, 'enter'),selectIndex(link.id)"
		@mouseleave="hoverLink(link.image, 'leave'),ItemIndex = null "
	>{{ link.name }}  Parent:{{ link.parent_id }} </a>				
</li>
[HTML] pobierz, plaintext 

Dostaję json'a w którym mam kolejne elementy listy ale niektore są parent a niektore child (jak się domyślacie takie menu).
Podczas iteracji ustawiam klasy, i dodatkowe atrybuty po których chciałbym wybierać jak ma się zachować child kiedy "mousover"/"hover"

a chciałbym żeby jeśli kursor znajduje się nad parentem znajdował child posiadający data = parent name i został pokazany lub schowany.
motam się jak kłębek włóczki i nie moge sobie z tym poradzić.

dla rozjaśnienia:

[HTML] pobierz, plaintext 
<ul class="list-none ml-0 pl-0 relative font-avenir text-white text-xl uppercase leading-relaxed">
	<li name="835" class="mb-2 parent">
		<a href="http://" class="text-white tracking-widest">Gifty Parent: </a>
	</li>
	<li name="836" class="mb-2 parent">
		<a href="http://" class="text-white tracking-widest">Co nowego Parent: </a>
	</li>
	<li data="836" name="837" class="mb-2 child">
		<a href="http://" class="text-white tracking-widest">Odkrywaj Parent:836 </a>
	</li>
	<li name="838" class="mb-2 parent">
		<a href="http://" class="text-white tracking-widest">Eksploruj Parent: </a>
	</li>
	<li name="839" class="mb-2 parent">
		<a href="http://" class="text-white tracking-widest">Stoper Parent: </a>
	</li>
	<li name="840" class="mb-2 parent">
		<a href="http://" class="text-white tracking-widest">Styl  Parent: </a>
	</li>
	<li data="840" name="841" class="mb-2 child">
		<a href="http://" class="text-white tracking-widest">Nowy Parent:840 </a>
	</li>
	<li name="842" class="mb-2 parent">
		<a href="http://" class="text-white tracking-widest">Wizyta Parent: </a>
	</li>
</ul>
[HTML] pobierz, plaintext 

elementy child mają dodatkowy parametr data który pokrywa się z name rodzica.
Nie wiem jak to połaczyć.

Dopiero zacząłem zabawę z Vue, przekopałem mnóstwo stron, wszędzie pokazują to samo ale nie to czego szukam.

Podpowiedzcie, pokażcie.

Pozdrawiam
amator

cokolwiek ?
wskazówka?
nic ... ?

Ten post edytował phpamator 21.03.2022, 22:54:34