模态对话框不显示 - PUG

Question

我目前正在开发一个简单的模态对话框，它应该在按下按钮时打开；计算出我将使用 bootstrap 示例 (https://getbootstrap.com/docs/5.0/components/modal/) 作为入门将是最好的快速获胜。

因为我使用 pug 作为视图引擎，所以我很快将 HTML 转换为 Pug 并测试它但没有成功。

模态容器未显示/弹出。我的控制台中没有出现任何错误。 Bootstrap 运行良好。

哈巴狗代码：

include modules/head
// Button trigger modal
button.btn.btn-primary(type='button' data-bs-toggle='modal' data-bs-target='#exampleModal')
    | Launch demo modal
// Modal
#exampleModal.modal.fade(tabindex='-1' aria-labelledby='exampleModalLabel' aria-hidden='true')
    .modal-dialog
        .modal-content
            .modal-header
                h5#exampleModalLabel.modal-title Modal title
                button.btn-close(type='button' data-bs-dismiss='modal' aria-label='Close')
            .modal-body
                | This is a test.
            .modal-footer
                button.btn.btn-secondary(type='button' data-bs-dismiss='modal') Close
                button.btn.btn-primary(type='button') Save changes

sdsadHead 包括 jquery 和 bootstrap (v4.4)。

有没有人知道为什么它不起作用？关于淡入淡出 css 设置的建议无济于事。

提前致谢。

Answer 1

正如肖恩在上面所提出的，问题是 Bootstrap.js 文件加载不正确。

开发者失败。

模态对话框不显示 - PUG

Modal Dialog not showing - PUG

html

node.js

pug