Question

我对React（和Java语言）来说还比较陌生，所以请多多包涵。

简而言之，我该如何在React的窗口/组件上触发一个调整大小事件？

现在下面是更多背景信息，它实际上可能证明我在这里问错了一个问题。

我正在尝试创建一个带有多个标签的小型应用。该组件取自BlueprintJS框架。这些选项卡的内容是使用javascript API加载的，而javascript API则使用对远程应用程序的RESTful请求。将在我的标签中呈现的内容是一些表格和图表。

这是一个警告。这些表和图表的实际呈现是由我必须使用的javascript API执行的，而不是由我的React应用程序执行的。我必须将ID传递给API，然后它将返回的内容渲染到该API中。

问题：仅正确显示默认活动选项卡的内容。如果我切换到我的React应用程序的任何其他选项卡，则不会呈现内容。但是，如果我调整窗口大小，则会立即呈现内容（我相信这是由我使用的javascript API处理的）。另外，如果我更新当前活动选项卡的参数以使API从远程应用程序加载更新的内容，则该内容也会呈现在活动选项卡中。

因此，我想出了在选项卡之间切换时是否可以模拟resize事件的信息，我可以呈现我的内容。

我尝试根据当前标签页是否处于活动状态，在自己的条件上设置条件类：

<div className={this.state.SelectedTabId === "tab1" ? "container" : "hidden"}>

其中“容器”和“隐藏”在CSS文件中配置的宽度不同，但这无济于事。我还尝试直接操作DOM（至少作为测试），但是即使那样也没有什么不同：

let e1 = document.getElementsByClassName('container')[0];
            e1.width = e1.scrollWidth - 1;
            renderedElement.resize(); //this is an API method which is supposed to re-render the content it returns

如何在React中模拟窗口调整大小

0 个答案: