css - 虚拟化 : Change background color after click on v-card

Question

这是我的 jsbin 链接，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事件来带来点击时的链式 react 。我点击卡片后背景变成灰色，但我想将背景变成蓝色。我已经使用 .v-card--link:before 类来更改背景颜色，但它不起作用。

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

Answer 1

尝试定位 :focus选择器

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

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