单击按钮时更改边框颜色vuetify v卡

Question

当用户单击图像中可以看到的v-card按钮时，我想将vuetify的边框颜色从limited-products更改为红色，showError下方，当用户单击removeError按钮时，ID为limited-products的v卡的边框颜色将变为白色。 In my codepen，我的代码有什么问题？

Answer 1

好像您只是缺少边框宽度。

将border-color修改为border，这样您的代码即可正常工作。

<v-card id="limited-products" :style="isShowError ? 'border: 1px solid red;' : 'border: 1px solid white;'">

Answer 2

您可以像这样将 v-card 包裹在 v-sheet 中：

<v-sheet outlined color="red" rounded>
    <v-card outlined elevation="0">
        ...
    </v-card>
</v-sheet>