如何在 Vuetify 的数据表中更改标签“排序依据”？

Question

该标签仅在 顶部的移动视图中可见v-data-table。我已经阅读了文档，没有这样的道具可以修改“排序依据”标签。

Answer 1

我们可以通过添加headerProps以下data选项轻松做到这一点：

new Vue({
  el: '#app',
  vuetify: new Vuetify(),
  data () {
    return {
      headerProps: {
        sortByText: "Custom Sort By Text"
      },
      headers: [
        //...
      ],
      items: [
        //...
      ]  
    }
  },
})

然后更新模板，如：

<v-data-table
  :headers="headers"
  :items="items"
  :items-per-page="5"
  class="elevation-1"
  :header-props="headerProps"
>      
</v-data-table>

现在，在移动视图中"Sort by"，它会显示而不是显示默认标签，"Custom Sort By Text"您可以根据需要对其进行修改。