const useStyles = makeStyles((theme) => ({ root:{ padding: 0, textAlign: 'left', flexDirection: '100vh', }, })); return ( <Container> <div className={classes.root}> <Grid container spacing={2} className={classes.Grid} justifyContent="center"> <Grid item xs={12}> <RadioGroup row aria-label="type" name="name" className={classes.weightradio} defaultValue={"1"} value={weightRadio} onChange={handleWeightRadio}> <FormControlLabel value="1" control={<Radio />} label="1kg" /> <FormControlLabel value="2" control={<Radio />} label="2kg" /> <FormControlLabel value="others" control={<Radio />} label=">3kg" /> </RadioGroup> </Grid> ..... </Gid>registro muéstrame---
index.js:1 Advertencia: React no reconoce el apoyo de
justifyContenten un elemento DOM. Si desea que aparezca intencionalmente en el DOM como un atributo personalizado,justifycontenten minúsculas para justificar el contenido. Si lo pasó accidentalmente desde un componente principal, elimínelo del elemento DOM.
Revisé el documento de MUI 4.0, se admite el justifyContent , ¿dónde está el problema?
Bien, tengo la respuesta.
justificar en lugar de justificar el contenido, y no debe establecerse en la raíz de la cuadrícula, corrija el código como se muestra a continuación,
<Grid container spacing={2} className={classes.Grid}> <Grid item xs={12} container justify="center"> //changed here <RadioGroup row aria-label="type" name="name" className={classes.weightradio} defaultValue={"1"} value={weightRadio} onChange={handleWeightRadio}> <FormControlLabel value="1" control={<Radio />} label="1kg" /> <FormControlLabel value="2" control={<Radio />} label="2kg" /> <FormControlLabel value="others" control={<Radio />} label=">3kg" /> </RadioGroup> </Grid>Hay una diferencia en las versiones. No todas las versiones 4.* son compatibles conJustifyContent Probablemente, las versiones anteriores a la 4.12 solo funcionan conJustify: https://github.com/mui-org/material-ui/pull/21845
Para 4.11.4 este es definitivamente el caso