Material-UI 选项卡在 JavaFX WebView 中不起作用

Question

我有一个使用 React 和 Material-UI 的网页，我想使用 JavaFX 的 WebView 将其嵌入到我的桌面应用程序中。但是，当我尝试这样做时，Material-UI 中的选项卡没有按预期工作。我第一次单击一个选项卡时，它按预期工作并且显示该选项卡的内容并且该选项卡被标记为活动选项卡。此后它停止工作，您无法切换标签页。

要重现问题，以下代码应该足够了：

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.BorderPane;
import javafx.scene.web.WebEngine;
import javafx.scene.web.WebView;
import javafx.stage.Stage;

public class TabTest extends Application {

    @Override
    public void start(Stage primaryStage) throws Exception {

        BorderPane pane = new BorderPane();
        Scene scene = new Scene(pane);

        WebView webView = new WebView();
        WebEngine webEngine = webView.getEngine();

        webEngine.load("http://www.material-ui.com/#/components/tabs");

        pane.setCenter(webView);

        primaryStage.setScene(scene);
        primaryStage.setMaximized(true);
        primaryStage.show();
    }

    public static void main(String[] args) throws Exception {
        Application.launch(TabTest.class);
    }
}

到目前为止的观察：

标签适用于常规网络浏览器。
在它停止工作后，整个网页似乎都会响应点击（Material-UI 点击动画随处触发）。我在 Material-UI 选项卡组件中添加了日志记录，并且在我单击的任何地方第一次单击时选择的选项卡上触发了 onTouchTap。

有谁知道可能是什么问题以及是否有解决方法？还是我应该将此作为 JavaFX 错误归档？

Answer 1

我找到了 Java 8 的解决方法。添加

{
display: inline;
position: relative;
}

每个Tab的样式

Material-UI 选项卡在 JavaFX WebView 中不起作用

Material-UI Tabs not working in JavaFX WebView

tabs

javafx

material-ui