更改 bootstrap vue 选项卡标题的标题颜色

I'm using bootstrap-vue.js to create a tab. The result is like this

我只想更改选项卡标题颜色，因为它使用我项目中的默认颜色。并来自 bootstrap-vue.js 官方链接（https://bootstrap-vue.js.org/docs/components/tabs https://bootstrap-vue.js.org/docs/components/tabs）有一个 title-item-class 用于对选项卡标题进行任何更改。所以我像这样创建代码：

<b-tab title="Transaction History" title-item-class="tab-title-class">

和我的CSS：

.tab-title-class {
    color: #FF0000 !important;  
}

但它没有任何效果。那么这里有什么问题呢？ 提前致谢。

Use v-bind指令来应用自定义类并使用引号来表示它是一个字符串：

<b-tab title="Transaction History" :title-item-class="'tab-title-class'">

:title-item-class只是一个别名v-bind:title-item-class

这是因为 bootstrap vue 使用props不是简单的 html 属性。在哪里title只是 html 属性，您不需要使用v-bind.

但我认为，你需要申请:title-link-class。这是因为链接标签正在那里应用。

<b-tab title="Transaction History" :title-link-class="'tab-title-class'">

使用时v-bind，它检查输入的类型。如果未定义，那么您将收到错误。所以，这里我们没有定义这样的类data选项，但只需为 css 分配一个字符串类即可正常工作。