Блог

Сегодня я впервые попытался установить Vuetify с помощью Vue3. Почти все работает правильно: компоненты импортируются правильно, такие классы, как «текстовый центр», тоже работают хорошо.

Но я заметил, что реквизит, такой как «темный», и классы, такие как «цвет-текст», не являются, и я не могу сказать, почему …

Вот мой 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

Спасибо!

Согласно классам vuetify, это должно быть text-red вместо red--text :

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