反应和材料UI和崩溃

Question

菜单：

```<Menu
                            anchorEl={anchorElNav}
                            anchorOrigin={{
                                vertical: 'bottom',
                                horizontal: 'left',
                            }}
                            transformOrigin={{
                                vertical: 'top',
                                horizontal: 'left',
                            }}
    
                            open={Boolean(anchorElNav)}
                            onClose={handleCloseNavMenu}
                            
                            
                            transitionDuration={0}
                            sx={{ display: { xs: 'block' } }}
                        
                            slotProps={{
                                paper: {
                                    sx: {
                                        backgroundColor: '#123456',
                                        minHeight:'0px',
                                        padding:'0px',
                                        minWidth:'0px',
                                        margin:'0px'
                                       
    
                                    },
                                },
                            }}
                        >
    
    
                            <Collapse in={checked} timeout={5000} >
                             <MenuItem key={'sdfad'} sx={{minHeight:'0px',minWidth:'0px',padding:'0px',margin:'0px'}} onClick={()=>{
                                handleCloseNavMenu 
                         
                            }}  >
                                    <div style={{display:'flex',flexDirection:"column",minHeight:'0px',minWidth:'0px',padding:'0px',margin:'0px'}} >
                                         {pages.map((page) => (
                                            <Typography key={page} variant='navbar' component='a' href='#' sx={{ minHeight:'0px',minWidth:'0px',padding:'0px',margin:'0px',textDecoration: 'none', cursor: location.pathname === '/' ? "default" : 'pointer', color: location.pathname === '/' && 'rgba(0,0,0,0.5)' }}>
                                                <span>Quinteto&nbsp;&nbsp;</span>
                                            </Typography>
                                        ))}
                                    </div>
                                
                            </MenuItem> 
                                </Collapse>
    
                        </Menu>```

要使自定义褪色正常工作，我需要使用TransIntionComponent = {customfade} 但是由于崩溃，它就无法正常工作，似乎从未声明过渡，并且菜单使用默认的“成长”。

看，我刚刚发布的方式正常工作，但是使用SettieMout的“不良解决方案”，在我看来，这只是一种糟糕的方法