Cómo cerrar un desplegable cuando se renderiza en otra página en Vue.
Tengo un desplegable de carrito como se puede ver a continuación:
Mi problema es que cada vez que voy a la siguiente página o hago algo, se queda abierto. Pero quiero que se cierre cuando vaya a otra página. Para esto mi componente está aquí:
{{ selected.name }}
{{ defaultValue }}
{{ option.name }}
Estoy abierto a cualquier tipo de solución para resolver este problema.
davy.ai
Solución
Puedes agregar un escucha de eventos al objeto
windowque escuchará el eventoblur. Cuando se active el eventoblur, puedes establecer la variableopencomofalse. Esto asegurará que el menú desplegable se cierre cuando el usuario navega fuera de la página.javascript
window.addEventListener('blur', () => {
this.open = false;
});