Estoy usando React con componentes con estilo, así que digamos que tengo un div como este:
export const Container = styled.div` display: flex; flex-direction: column; ` return ( <Container onMouseEnter{() => alert("foo")} onMouseLeave{() => alert("bar")} > Content </Container> )¿Cómo desactivo estas alertas (eventos onMouseEnter/onMouseLeave ) cuando el ancho de la pantalla del dispositivo es inferior a 700 px?
Puedes usar Window.matchMedia()
if ( window.matchMedia('(max-width: 700px)').matches ) { // your function executed below 700px window width }