首页 > 解决方案 > vuetify 表自定义排序“TypeError:无法读取未定义的属性'过滤器'”

问题描述

我在 vuetify 中遇到自定义排序实现的问题。

      <v-data-table
        :headers="table.headers"
        :items="table.items"
        :search="search"
        disable-pagination
        :header-props="{sortByText: 'sortiere nach...'}"
        :loading="loading"
        hide-default-footer
        :custom-sort="customSort"
        @click:row="rowClickHandler"
      />

这是我现在的 customSort 功能

    customSort(items, sortBy, sortDesc, locale) {
      if (!this.table.loading) {
        console.log(items)
        console.log(sortBy)
        console.log(sortDesc)
        console.log(locale)
      }
    }

问题是我变胖了 Error in render: "TypeError: Cannot read property 'filter' of undefined" ,也许这取决于我用 axios 获取的异步数据?

我在我的created()街区里像这样取东西

    async fetchUsers() {
      await axios
        .get('myApiPath')
        .then((res) => {
          this.table.items = res.data
          this.table.loading = false
        })
        .catch((err) => {
          console.log(err)
        })
    },

标签: vue.jsaxiosvuetify.js

解决方案


您需要从customSort(). 我相信这与您的异步数据获取无关。

customSort(items, sortBy, sortDesc, locale) {
  if (!this.table.loading) {
    console.log(items.map(e => e.calories));
    console.log(sortBy);
    console.log(sortDesc);
    console.log(locale);
  }

  // sort items here

  return items;
}

这是一个示例custom-sort()实现。


推荐阅读