Estaba usando el punto de interrupción predeterminado proporcionado por Material UI para mis consultas de medios, luego agregué un punto de interrupción más (móvil: 400), todos los demás puntos de interrupción funcionan bien, excepto cuando alcanzo el ancho de 400px, los cambios no surten efecto en eso Punto, ¿estoy haciendo algo mal aquí?

 const theme = createTheme({ breakpoints: { values: { xs: 0, mobile: 400, sm: 600, md: 900, lg: 1200, xl: 1536, }, },

a continuación, cuando la pantalla alcanza los 600 px de ancho, el valor de MQsm cambia a 'verdadero', pero cuando alcanzo el ancho de 400 px, MQmb no cambia.

 const Navbar = (props) => { const cartQuantity = useSelector((state) => state.cart.totalQuantity); const classes = useStyles(); const theme = useTheme(); const MQsm = useMediaQuery(theme.breakpoints.down("sm")); //600px const MQmb = useMediaQuery(theme.breakpoints.down("mobile")); //360px console.log(MQsm); console.log(MQmb);