Bootstrap Vue - 更改下拉背景

Question

我正在使用Bootstrap Vue插件 - https://bootstrap-vue.js.org/

当有人从下拉列表中选择值时，我需要更改下拉菜单默认背景。

但这就是问题所在。当有人点击下拉菜单时，他们会在dropwdown包装中切换“show”类。没有任何新类的红色突出显示div。

我尝试设置.dropdown-toggle类，但它只覆盖默认样式。有解决方案吗

.dropdown-toggle{
  background-color: #FF5722;
  border-color: #FF5722;
}

Jsfiddle

Answer 1

您可以直接通过样式进行操作。例如：

  <b-form-select
  options="[1, 2, 3]"
  style="background: red">
</b-form-select>

或创建一个类...

Answer 2

  <button type="button" class="btn btn-danger dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
      <span class="sr-only">Toggle Dropleft</span>

在btn btn-secondary更改按钮类的位置，如危险，主要等....有关更多信息，请点击此链接

https://getbootstrap.com/docs/4.0/components/dropdowns/