如何在Vuetify的v-pagination组件中隐藏上一页和下一页按钮

有两种简单的方法可以实现需求：

方法一：使用组件内置属性 #

Vuetify的v-pagination组件自带hide-prev和hide-next布尔属性，直接添加到组件上就能分别隐藏上一页和下一页按钮：

<v-pagination
  v-model="page"
  :length="pageCount"
  :total-visible="8"
  color="primary"
  hide-prev
  hide-next
/>

方法二：通过CSS样式隐藏 #

如果你的Vuetify版本不支持上述属性，可以用CSS选择器直接隐藏对应按钮：

全局样式 #

.v-pagination__prev,
.v-pagination__next {
  display: none !important;
}

Vue单文件组件局部样式 #

如果需要在单个组件内生效，要使用深度选择器（不同Vue版本写法略有区别）：

/* Vue 2 */
::v-deep .v-pagination__prev,
::v-deep .v-pagination__next {
  display: none !important;
}

/* Vue 3 */
:deep(.v-pagination__prev),
:deep(.v-pagination__next) {
  display: none !important;
}

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