如何移除v-navigation-drawer旁的边框？

你遇到的问题是因为Vuetify的v-navigation-drawer组件内部默认渲染了.v-navigation-drawer__border元素来实现边框/分隔线效果，直接写类选择器会被Vue的scoped样式隔离限制，导致即使加了!important也无法生效。

以下是可行的解决方法：

方案1：Vue 3 + Vuetify 3 适用 #

在单文件组件的<style scoped>中添加深度选择器穿透样式限制：

:deep(.v-navigation-drawer__border) {
  display: none;
}

方案2：Vue 2 + Vuetify 2 适用 #

针对Vue 2项目，改用::v-deep语法：

::v-deep .v-navigation-drawer__border {
  display: none;
}

备选方案：全局样式（谨慎使用） #

如果不想用深度选择器，可将样式写在无scoped属性的全局<style>标签中：

.v-navigation-drawer__border {
  display: none !important;
}

注意：这种方式会影响项目中所有v-navigation-drawer组件的边框样式，需根据实际场景选择。

内容的提问来源于stack exchange，提问作者Quentin