Vuetify 组件标签内的颜色变体属性

Question

我正在尝试将颜色变量作为 HTML 属性添加到导航抽屉组件。我的自定义原色有效，但我想添加 primary-darken3 颜色变体。导航抽屉组件如下所示：

<v-navigation-drawer absolute permanent color="primary" class="sidebar-container">
</v-navigation-drawer>

我可以通过添加自定义 css 样式向组件添加 primary-darken3 颜色变体：

.sidebar-container {
    background-color: var(--v-primary-darken3) !important;
}

我想知道是否可以通过某种方式将此颜色变体传递给组件的颜色属性或作为其他属性来使用它？

Answer 1

只需将 class darken-3 添加到抽屉式导航组件即可：

<v-navigation-drawer absolute permanent color="primary" class="darken-3">
</v-navigation-drawer>

你可以用任何使用 color prop

的组件来做到这一点