Bootstrap Electron 中的工具提示功能

Question

我在 Electron 中使用 Bootstrap，我正在尝试使用包含的工具提示功能。当我运行页面作为 'traditional' 网页时，工具提示有效（使用 Chrome）。当我在 Electron 中运行它时，它不起作用，只是作为标题类型出现 mouse-over。代码：

<button id="btn-submit" class="btn btn-primary" data-toggle="tooltip" data-placement="top" title="Tooltip on top">Button</button>

然后

<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="~/js/site.js" asp-append-version="true"></script>
<script>
    (function () {
        $('[data-toggle="tooltip"]').tooltip();
        const { ipcRenderer } = require("electron");});

我发现 Electron 的 reference 不支持 "Native popovers and Tooltips" - 我认为这意味着我需要提供所需的 js 支持才能使工具提示正常工作。我如何在 Electron 中获得工具提示？如果标准 bootstrap JS 在 electron 中不起作用，有人可以解释为什么我在寻找其他 JS controls/libraries 时可以知道吗？

Answer 1

我在检查其他一些不可用但应该可用的功能时发现了答案。虽然我在 bootstrap 文档中没有找到对此的任何引用，但似乎 jquery 没有初始化。我修改了 jquery 导入如下：

<script src="~/lib/jquery/dist/jquery.min.js" onload="window.$ = window.jQuery = module.exports;"></script>

现在 Bootstrap 工具提示按预期工作。

Bootstrap Electron 中的工具提示功能

Bootstrap Tooltip Functionality in Electron

html

javascript

twitter-bootstrap-tooltip

electron

bootstrap-4