为什么我的 vuejs 组件不渲染，我需要一个库？

Question

我有这个组件，它是一个简单的组件，但不渲染，只是我看到“销售”字样，我需要安装另一个库吗？

<template>
  <v-app>
    <v-container>
      <v-row dense align="stretch">
        <v-col cols="4">
          <v-card min-height="100%">
            <v-card-text class="green--text">
              <h5 class="text-truncate text-uppercase">Sales</h5>

            </v-card-text>
          </v-card>
        </v-col>
      </v-row>
    </v-container>
  </v-app>
</template>

<script>
  export default {
    name: 'Taps',
    setup() {
    },
  }
</script>

我的依赖是：

"vue": "^3.2.20",
    "vue-router": "^4.0.0-0",
    "vue3-perfect-scrollbar": "^1.5.5",
    "vuex": "^4.0.0-0",

Answer 1

不幸的是 Vuetify 还不支持 Vue 3 。

当前版本的 Vuetify 不支持 Vue 3。对 Vue 3 的支持将随着 Vuetify v3 的发布而提供。 创建新项目时，请确保您从 Vue CLI 提示中选择了 Vue 2，或者您正在安装到现有的 Vue 2 项目。

您需要降级 Vue 版本或选择不同的组件库。 Quasar是 Vuetify 的绝佳替代品，具有许多相同的组件和功能。