我正试图根据this section的文档重新创建material UI自定义对话框组件,我不明白为什么使用回调函数onClose
条件来显示DialogTitle
中的IconButton
组件:
<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>
据我所知,如果状态设置正确,IconButton
总是被渲染的.我只是想知道在三元运算符中使用onClick
回调函数是否有特定的原因或模式?我试图完全删除三元运算符,但所有操作都是一样的.