Vuetify добавляет полосу прокрутки, когда она не нужна

Question

Я создал новый проект с помощью vue-cli, затем добавил vuetify с помощью vue add vuetify. Открыл сайт и увидел пустую страницу с бесполезной полосой прокрутки

Я пытался смонтировать приложение без App компонента, но проблема все еще существует. Исчезает только когда я удаляю import './plugins/vuetify'

main.js

import Vue from 'vue'
import './plugins/vuetify'
import App from './App.vue'

Vue.config.productionTip = false

new Vue({
  render: h => h(App),
}).$mount('#app')

Answer 1

У меня та же проблема с использованием vue-cli 3.8 + buefy.

Не лучшее решение, но я использую два способа:

Глобальное скрытие полосы прокрутки

Полоса прокрутки может быть скрыта в стиле CSS.

<style>
html {
  overflow: hidden !important;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

html::-webkit-scrollbar {
  width: 0;
  height: 0;
}
</style>

Скрыть полосу прокрутки в определенных видах

Я могу скрыть полосу прокрутки в home.vue, используя стиль DOM.

<script>
  mounted: function() {
    let elHtml = document.getElementsByTagName('html')[0]
    elHtml.style.overflowY = 'hidden'
  },
  destroyed: function() {
    let elHtml = document.getElementsByTagName('html')[0]
    elHtml.style.overflowY = null
  }
</script>