Vue 3 - Vuetify 3：颜色 - 文本不起作用

Question

我今天第一次尝试使用 Vue3 安装 Vuetify。几乎一切正常：组件正在正确导入，类像“text-center”也运行良好。

但我注意到像“深色”和类像“颜色--文本”这样的道具不是，我也不知道为什么...

这是我的 plugins/vuetify.js 文件：

import '@mdi/font/css/materialdesignicons.css'
import 'vuetify/lib/styles/main.sass'
import { createVuetify } from 'vuetify'
import * as components from 'vuetify/lib/components'
import * as directives from 'vuetify/lib/directives'

export default createVuetify({
  components,
  directives,
})

例如：

<h1 class="display-2 font-weight-bold mb-3">
    <div class="red--text">Welcome to the Vuetify 3 Alpha</div>
</h1>

文字不会变红，没什么变化

我不知道问题出在哪里...这是一个 S.O.S

谢谢！

Answer 1

根据 vuetify classes 应该是 text-red 而不是 red--text :

 <v-app>
    <div class="bg-purple-darken-2 text-center">
      <span class="text-red">Lorem ipsum</span>
    </div>
  </v-app>

Vue 3 - Vuetify 3：颜色 - 文本不起作用

Vue 3 - Vuetify 3 : color--text not working

colors

vue.js

vuetify.js

vuejs3

vuetifyjs3