<p><br /></p> <pre class="brush:php;toolbar:false;"><서랍 앵커="왼쪽" className="drawerArea 왼쪽 탐색" 변형="영구" 열림={참} 종이소품={{ 스타일: { width: "상속", 배경: "#172B4D", backgroundImage: `선형 그라데이션(오른쪽으로,#172B4D 60%, 흰색 40%)`, 테두리: "없음", OverflowY: "숨김", }, }} > <박스> <박스> <박스> <Box className="listing" sx={{ 너비: "100%" }}> <List className="mp-0 wh-100 오버플로 오버레이"> {메뉴 && 메뉴.길이 > 0 && menus.map((항목, 색인) => ( <박스 키={index}> <목록항목 ref={popoverAnchor} className={`mp-0 NavigationList flex-start-center`} ** onMouseEnter={(e) => { setNestedArr([...item?.children]); popoverEnter(e); setAnchorEl(e?.currentTarget); }} onMouseLeave={(e) => { popoverLeave(e); }}** onClick={(e) => { console.log(항목,'parent_clicked') }} > <ListItemText> <박스> {micons[항목?.이름] ? ( 마이콘[항목?.이름] ) : ( <아이콘>{item?.icon_class}</Icon> )} </박스> <타이포그래피> {상품명} </타이포그래피> </타이포그래피> } /> </목록항목> </박스> ))} </목록> </박스> </박스> </박스> {열기 && 중첩Arr.length ? ( <중첩메뉴 열다={열다} setOpen={(val) => setOpen(발)} 앵커엘={앵커엘} 중첩Arr={중첩Arr}가벼운 배경={lightBackground} 이차색상={보조색상} popoverAnchor={popoverAnchor} popoverEnter={popoverEnter} popoverLeave={popoverLeave} /> ) : 없는} </박스> </서랍></pre> <p><strong> 페이지 왼쪽에는 몇 가지 메뉴가 있습니다(MUI 라이브러리 및 Material-ui-nested-menu-item 라이브러리 사용). 마우스를 Listitems 위로 가져가면 다음과 같은 메뉴가 표시됩니다. 중첩 또는 하위 메뉴를 사용하고 마우스가 떠날 때 메뉴를 닫는 데 문제가 있는 것은 메뉴 위로 마우스를 가져가는 동안 onMouseLeave 이벤트가 동시에 실행되어 메뉴가 열리지 않는다는 것입니다. 문제가 무엇인지 알 수 없습니다. </strong></p>