如何在 vue 中使用引导程序答案

【问题标题】：How to use bootstrap in vue如何在 vue 中使用引导程序
【发布时间】：2021-04-26 20:51:27
【问题描述】：

我正在尝试在我的 Vue 项目中使用 Bootstrap。（使用 Vue cli 创建）
我通过 npm 安装了以下东西。

我已将 Bootsrap 导入我的 main.js

import 'bootstrap'
import 'bootstrap/dist/css/bootstrap.min.css'

问题是我无法在 Bootsrap 中使用下拉菜单。
还有什么我应该做的吗？

【问题讨论】：

如果您升级到bootstrap-5，您将不需要使用像 bootstrap-vue 这样的第三方库，因为不再需要 jquery：stackoverflow.com/questions/65547199/…

【解决方案1】：

有bootstrap package specially for vue 你可以使用下面的命令来安装它

npm install bootstrap-vue

或

yarn add bootstrap-vue

然后在您的 main.js 文件中，您可以将其导入并用作

import BootstrapVue from 'bootstrap-vue';
import 'bootstrap-vue/dist/bootstrap-vue.css';

Vue.use(BootstrapVue)

【讨论】：

我可以使用将类放在事物上的基本方式，还是必须使用它们提供的自定义标签？
您需要使用他们在文档中提到的自定义标签，这还取决于您是否使用范围/非范围样式
如果你觉得这个答案有用，请考虑给它一个upvote ..谢谢:)\
@HUNcut_ Can I use the basic way of just putting classes on things，是的，你可以。您不必必须使用这些组件，尽管我确实推荐它，因为它通常更少标记，更统一。但是，这仅对 100% 基于 CSS 的内容有效。对于通常需要 Bootstrap.js 的组件，例如 Modals、Dropdowns、Toasts、Popover/Tooltips 等。您将需要使用它们的 vue 组件对应物。