如何在移动视图上隐藏或禁用 vuetify 3 <v-data-table> 的“排序依据”输入和标签

Question

显示过滤器的移动视图

我正在使用 vuetify 来显示一些数据：

 <v-data-table-server
                            :items-per-page="itemsPerPage" 
                            :headers="headers"
                            :items="serverItems" 
                            :items-length="totalItems" 
                            :loading="loading" 
                            :search="search"
                            item-value="id" 
                            fixed-header
                            no-data-text="Sin datos"
                            @update:options="loadItems" 
                            items-per-page-text="autos por página" loading-text="obteniendo datos..."
                            >

栏目：

  headers: [
                { title: 'Patente', key: 'patente', sortable: false },
                { title: 'Marca', key: 'marca', sortable: false },
                { title: 'Modelo', key: 'modelo', sortable: false },
                { title: 'Precio', key: 'precio', sortable: false },
                { title: 'Caja', key: 'caja', sortable: false },
                { title: 'Combustible', key: 'combustible', sortable: false },
                { title: 'Pasajeros', key: 'pasajeros', sortable: false },
                { title: 'Descripcion', key: 'descripcion', sortable: false },
                { title: 'Foto', key: 'fotos', sortable: false },
                { title: 'Opciones', key: 'options', sortable: false }
            ],

我尝试将列属性“sortable”设置为 false

Answer 1

除了CSS解决方案之外，还没有找到任何方法。

.v-data-table-headers--mobile {
  display: none;
}