Having trouble assigning an active class to the chosen V-Card element when a Color Attribute is specified:
For instance:
<v-col v-for="data in datas" :key="data.id">
<v-card
style="height: 10vh;"
flat
dark
color="green" // <--- The selectedItem Class doesn't work when this is set
@click="doSomething(), activeId=data.id"
:class="{ 'selectedItem' : activeId === data.id}"
>
{{ data.id }}
</v-card><style scoped>
.selectedItem {
background-color: blue !important;
}
</style>The selectedItem Class functions properly when the color attribute is absent and the background is white!
What could be causing this issue?