Estoy tratando de recrear el componente de diálogo personalizado de IU de material de acuerdo con esta sección de documentación y no puedo entender por qué la función de devolución de llamada en la condición de IconButton se usa para mostrar el componente onClose en DialogTitle :
<DialogTitle sx={{ m: 0, p: 2 }} {...other}> {children} {onClose ? ( <IconButton aria-label="close" onClick={onClose} sx={{ position: 'absolute', right: 8, top: 8, color: (theme) => theme.palette.grey[500], }} > <CloseIcon /> </IconButton> ) : null} </DialogTitle> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script> Según tengo entendido, el IconButton siempre se representa si configura el estado correctamente. Me pregunto si hay una razón o patrón específico para usar la función de devolución de llamada onClick dentro del operador ternario. Traté de eliminar el operador ternario por completo y todo funciona igual.
Bueno, el botón pierde todo su propósito si no hay una función onClose, quiero decir que su objetivo es ejecutar esa devolución de llamada. Entonces, si no hay devolución de llamada, no muestre el botón.