Why doesn't the keydown event on the div work?

Question

Vue.js

There is a popup that opens to the entire page in height and width, a handler was hung on the wrapper , but this event simply does not work. The task is as follows - so that the popup closes on escape, and the slider (self-written) in it reacts to the left and right buttons. The question is exactly why the event does not fire, because the block is full screen? And how to do it right, because I have an idea to hang an event handler on window, but how to do it right in Vue? After all, if this is done, then at any time any key is pressed, the handler !!is for the popup!! will run every time, even if the popup is closed altogether. @keydown="closePictBuildingPopupSELF"

Answer 1

https://stackoverflow.com/questions/148361/how-can... will help
you

1. Make your div focusable
   
2. Before opening Remember where the user's focus is, if any
   
3. Open popup and move focus to it
   
4. Block the ability for the focus to move outside of the modal window
   
5. When closing the popup, return the user's focus to where it was before
   

Besides. Inside the Vue component, you can easily hang an event handler on the entire document. The main thing:

1. When deleting a component, remove handlers as well
   
2. Inside the handler, check if further processing makes sense
   

This is true for components such as modals so that you don't have too many of them on the page.