Vuetify：单击 v-card 后更改背景颜色

Question

这是我的 jsbin link, https://jsbin.com/puhozirunu/edit?html,js,output

这是我正在使用的 Vuetify 的 v-card 组件，

<v-card @click="myClick()">
   <v-card-title>hello</v-card-title>
   <v-card-text>
      Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facilis officiis similique non quod quaerat est vitae expedita, iusto id sunt sint, officia neque et cumque, culpa quis inventore veritatis quam.
   </v-card-text>
</v-card>

我已经使用 @click 事件在点击时产生连锁反应。我点击卡片后背景变成灰色，但我想把背景变成蓝色。我已经使用 .v-card--link:before class 更改背景颜色，但它不起作用。

.v-card--link:before{
  background: blue !important;
}

Answer 1

尝试定位 :focus 选择器

.v-card--link:focus {
  background: blue;
}

.v-card--link:focus::before {
  opacity: 0;
}

Vuetify：单击 v-card 后更改背景颜色

Vuetify: Change background color after click on v-card

css

sass

vuetify.js