Déclenchez simultanément les événements d'entrée et de sortie de la souris
<p><br /></p>
<pre class="brush:php;toolbar:false;"><Tiroir
ancre = "gauche"
className = "drawerArea navigation à gauche"
variante = "permanent"
ouvert={vrai}
PaperProps={{
style: {
largeur : "hériter",
arrière-plan : "#172B4D",
backgroundImage : dégradé linéaire (à droite, #172B4D 60 %, blanc 40 %) ,
bordure : "aucun",
overflowY : "caché",
},
}}
>
<Boîte>
<Boîte>
<Boîte>
<Box className="listing" sx={{ width: "100%" }}>
<List className="mp-0 wh-100 overflow-overlay">
{menus &&
menus.longueur > 0 &&
menus.map((élément, index) => (
<Clé de boîte={index}>
<ListeItem
ref={popoverAnchor}
className={`mp-0 navigationList flex-start-center`}
** onMouseEnter={(e) => {
setNestedArr([...élément?.enfants]);
popoverEnter(e);
setAnchorEl(e?.currentTarget);
}}
onMouseLeave={(e) => {
popoverLeave(e);
}}**
onClick={(e) => {
console.log(élément,'parent_cliqué')
}}
>
<ListItemText>
<Boîte>
{micons[élément?.nom] ? (
micons[élément?.nom]
) : (
<Icône>{item?.icon_class}</Icon>
)}
≪/Boîte>
<Typographie>
{nom de l'article}
</Typographie>
</Typographie>
}
/>
</ListItem>
≪/Boîte>
))}
</Liste>
≪/Boîte>
≪/Boîte>
≪/Boîte>
{ouvrir && nestedArr.longueur ? (
<MenuImbriqué
ouvert={ouvert}
setOpen={(val) => setOpen(val)}
ancreEl={ancreEl}
nestedArr={nestedArr}lightBackground={lightBackground}
couleursecondaire={couleursecondaire}
popoverAnchor={popoverAnchor}
popoverEnter={popoverEnter}
popoverLeave={popoverLeave}
/>
) : nul}
≪/Boîte>
</Tiroir></pré>
<p><strong> Il y a quelques menus sur le côté gauche de la page (utilisant la bibliothèque MUI et la bibliothèque materials-ui-nested-menu-item), lorsque la souris passe sur Listitems, elle affichera un menu avec imbriqué ou sous-menu et fermez le menu lorsque la souris quitte, mais le problème auquel je suis confronté est que l'événement onMouseLeave est déclenché en même temps lors du survol du menu, de sorte que le menu ne s'ouvre pas. Je n'arrive pas à comprendre quel est le problème. </strong></p>
