vue.js - Vuetify 删除 v-data-table 上的分页

标签 vue.js pagination vuetify.js

我想删除 v-data-table 上的分页,使用 hide-default-footer 但它不起作用。

尝试使用 hide-dafault-footer

<v-data-table
        :headers="headers"
        :items="desserts"
        hide-default-header
        hide-default-footer
        class="elevation-1"
      >
        <template slot="items" slot-scope="props">
          <td>{{ props.index }}</td>
          <td>{{ props.item.name }}</td>
          <td>{{ getProject(props.item.project_uuid) }}</td>
          <td>{{ props.item.deadline }}</td>
          <td>{{ getUser(props.item.executor) }}</td>
          <td>{{ getUser(props.item.creator) }}</td>
          <td>{{ props.item.description }}</td>
        </template>
      </v-data-table>

想去掉分页

最佳答案

应该是 :hide-default-footer="true"

<v-data-table
        :headers="headers"
        :items="desserts"
        :hide-default-header="true"
        :hide-default-footer="true"
        class="elevation-1"
      >
        <template slot="items" slot-scope="props">
          <td>{{ props.index }}</td>
          <td>{{ props.item.name }}</td>
          <td>{{ getProject(props.item.project_uuid) }}</td>
          <td>{{ props.item.deadline }}</td>
          <td>{{ getUser(props.item.executor) }}</td>
          <td>{{ getUser(props.item.creator) }}</td>
          <td>{{ props.item.description }}</td>
        </template>
      </v-data-table>

演示在 codepen

关于vue.js - Vuetify 删除 v-data-table 上的分页,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57371009/

相关文章:

javascript - 当托管在服务器上时,如何使 Vue.JS 项目正常工作?

javascript - 如何在Vue js中处理未定义的 "Error in render: TypeError: Cannot read property ' abc'

php - 带有修改表的 Codeigniter 分页

webpack - 如何在 VueJS Webpack 项目中使用 Modernizr

vue.js 如何使 v 槽模板动态化?

javascript - vuejs - 使用谷歌地图的 Safari 浏览器导航

vue.js - Nuxt.js - 在所有 url 的末尾强制尾随斜杠

mysql - Laravel 点击页面分页

grails - 分页与集合

vue.js - 构建 dist 文件夹并将其发布到 github 页面