bootstrap-4 - Xterm 不适用于 Bootstrap 导航选项卡

Question

我正试图让 xterm 在我的电子单页应用程序中工作。我的问题是 xterm 的 div 元素在另一个选项卡中，在启动/初始化时不可见。如果应用程序启动并且我单击我的 xterm div 元素的导航选项卡，它只是一个没有任何输出的小黑框。

如果我在不加载 bootstrap.css 的情况下启动我的应用程序，它可以工作，并且我可以在 xterm div 元素中看到我的输出。但是问题是没有任何引导功能。

我怎么解决这个问题？

Answer 1

我找到了解决我的问题的方法。我的应用程序启动后，我不会直接初始化 xterm。我将等到用户单击带有终端的“导航选项卡”，然后在它之后初始化 xterm。

$('a[data-toggle="tab"]').on('shown.bs.tab', (e) => {
    if (/#MyTabID/gi.test(e.target.href) && this.MySshObjRef === null) {
        this.initMySshObj()
    }
})