Vuetify - 将字段添加到数据表页脚？

Question

我想在 Vuetify 数据表页脚的左侧添加一个文本字段，如下所示。有谁知道如何做到这一点？

我知道可以隐藏页脚并构建自己的页脚，但我想要其余的默认功能。如果任何人都可以访问默认页脚代码，也可以提供一个更简单的起点。

谢谢你！

Answer 1

我能够通过使用页脚插槽并将元素的位置设置为“绝对”来获得您正在寻找的功能：

<template v-slot:footer>
    <v-checkbox style="position: absolute" class="pa-0 pl-2" label="Show Archived" hide-details />
</template>

结果：

Answer 2

也许为时已晚，但您可以在已安装的挂钩中搜索页脚的元素。然后用innerHTML附加HTML：

mounted() {
    var footer = document.getElementsByClassName('v-data-footer')
    for (var i = 0; i < footer.length; i++) {
        footer[i].innerHTML += '<div>asad</div>'
    }
},