如何使反应网络应用程序全屏

问题描述：

我想在用户转到特定网页（没有地址栏，没有导航栏，只显示网页）后使我的反应Web应用程序全屏。我在网上尝试了很多模块，但他们没有工作。这个问题有很好的解决方案吗？如何使反应网络应用程序全屏

答

一种方法是只选择您想放置应用程序的容器。例如，假设你想保留父应用程序的所有样式，你可以在ReactDOM渲染中定位正文。

ReactDOM.render(
    <ActiveWidgetArea widgets={yourData}/>, 
    document.querySelector('body') 
);

我想这在Drupal站点，并与我的应用程序做出反应填充的屏幕，但留下了很多的东西完好无损。也许这些是在加载React应用程序之后加载的东西。你也可以定位html元素。

这也可能有助于了解您的父应用程序是什么，以及网站的其他部分是如何构建的。

你能举一个小例子，让我可以有一个更好的图片吗？ – Darren

@Darren我不知道你在找什么。该选择器'document.querySelector（'body'）'选择主体，'.render'将应用程序放到选择器所在的位置。我认为你应该提供关于网站建设的更多细节，比如这是一个WordPress站点，海峡HTML等。 – icicleking

好，它的工作原理！ – Darren

答

您可以尝试使用Javascript全屏API。例如：

document.documentElement.webkitRequestFullscreen()