我想在文本字段中有条件地应用文本颜色类。我想要的类是red--text
,像这样:
:class="{ red--text: myModel.someBool }"
...但这会导致解析错误。问题与类名有关,我认为,因为这有效:
<v-text-field
v-model="myModel" label="My Text"
:class="{ red: myModel.someBool }"
></v-text-field>
...但我想为文本着色,而不是整个字段。
将所需的类名括在引号 'red--text'
中可以防止解析错误,但对颜色没有影响。
有没有办法得到我想要的东西?
最佳答案
创建一个适用于输入的自定义范围样式(因为 v-text-field 的类适用于包含的 div)。
<style scoped>
.my-text-style >>> .v-text-field__slot input {
color: red
}
</style>
这个样式名可以包含连字符,只要在类表达式中被引用即可。使用 v-bind 绑定(bind)类...
<v-text-field
v-model="myModel" label="My Text"
:class="{ 'my-text-style': myModel.someBool }"
></v-text-field>
关于javascript - 如何有条件地更改 vue/vuetify 文本字段颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54932104/