Xterm 无法使用 Bootstrap 导航选项卡

Question

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

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

我该如何解决这个问题？

Answer 1

我找到了解决问题的办法。我的应用程序启动后不会直接初始化 xterm。我会等到用户点击其中包含终端的 "Nav Tab" 并在它之后初始化 xterm。

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

Xterm 无法使用 Bootstrap 导航选项卡

Xterm not working with Bootstrap Nav Tabs

electron

bootstrap-4

xtermjs