Bootstrap，popper.js和vue.js

Question

在我的laravel應用程序中，我有用vue.js呈現的頁面。 我想在此頁面中添加一些彈出窗口並使用popper.js。 根據文檔，此庫包含在bootstrap.bundle.min.js中。

我的html頁面中有這個：

<script src="https://code.jquery.com/jquery-3.3.1.min.js"crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.bundle.min.js"></script>

我的Vue組件中有以下方法：

        showCalendarChoiceHelpPopover() {
            console.log("click");
            $('#calendar').popover({
                trigger: 'focus',
                title: 'title',
                content: 'content'
            });
        }

加載頁面時，出現以下錯誤消息：

TypeError: __WEBPACK_IMPORTED_MODULE_5_jquery___default(...)(...).popover is not a function

Answer 1

好的朋友，如果您使用Bootstrap 4，則需要包含Popper.js

https://getbootstrap.com/docs/4.0/getting-started/introduction/#js

我們的許多組件都需要使用JavaScript才能起作用。 具體來說，它們需要jQuery，Popper.js和我們自己的JavaScript插件。

並先記住jQuery，然后記住Popper.js，然后記住Bootstrap JS。