Vuetify 日历高度问题

Question

我试图防止在使用 Vuetify 的 sheet 和日历时出现两个滚动条。

这是我的代码：

<template>
  <v-app>
    <v-main>
      <v-container fluid class="fill-height">
        <v-row justify="center" class="fill-height">
          <v-col cols="12" class="fill-height">
            <v-sheet class="fill-height">
              <v-calendar type="week" />
            </v-sheet>
          </v-col>
        </v-row>
      </v-container>
    </v-main>
  </v-app>
</template>

Answer 1

只需覆盖 Vuetify 日历组件的 CSS 即可删除多余的滚动条：

.v-calendar-daily__scroll-area {
  overflow-y: hidden !important;
}

同时从 v-sheet 中删除 class="fill-height" ，它使日历有点重叠。我不知道你为什么添加它。

在这里查看： https://codepen.io/nmdatit/pen/OJpdwox

Vuetify 日历高度问题

Vuetify calendar height issues

css

height

vue.js

vuetify.js