Is there a way to enter fullscreen mode from any component in React without using providers or wrapper div?

I know that fullscreen mode can be achieved by using packages like fscreen or react-full-screen, but I'd like to omit that.

If wrapper or provider is obligatory, what's the most efficient way to enter fullscreen? I have a lot of components and different views and I want to have a button that onClick enters fullscreen of the whole page, regardless to where that button is inside DOM.

CodePudding user response：

In order to enter Full screen mode, you can run this on click:
Element.requestFullscreen()

And if you want to exit it you can call this method:
document.exitFullscreen()