Как получить отфильтрованные элементы в Vuetify Datatable - PullRequest
Новая
       27

Как получить отфильтрованные элементы в Vuetify Datatable

0 голосов
/ 22 января 2020

Привет,

У меня есть vattify datatable (backend Laravel), в котором есть фильтр для столбца. Мне нужно получить отфильтрованные данные из таблицы данных и передать их бэкэнду для создания файла PDF.

Я пытался использовать событие current-items в vuetify datatable, но результат был неверным. Он возвращает только отфильтрованные данные на первой странице.

Вот мой "https://codepen.io/prasadchinwal5/pen/eYmbvYb". Пожалуйста, введите значение 500 в столбце «Меньше, чем фильтр» и проверьте консоль.

Любая помощь приветствуется.

1 Ответ

0 голосов
/ 22 января 2020

Вы должны взять свой базовый набор данных и вычислить массив на основе тех же фильтров, которые используются в определении столбца v-data-table. ie. 

computed:{    
    currentItems(){
      return this.desserts.filter(val=>val.calories < parseInt(this.calories))
    },
   currentItemsWithSearch(){
      return this.currentItems.filter(val=> 'search logic here')
    }       
}

Значение currentItems должно соответствовать данным таблицы. Это применение второго и отдельного фильтра, аналогичного тому, что вы сделали для определений столбцов. 

 {
          text: 'Calories',
          value: 'calories',
          filter: value => {
            if (!this.calories) return true

            return value < parseInt(this.calories)
          },
        }

В идеале вы хотели бы использовать массив currentItems в качестве входных данных элементов таблицы данных для учета В поле «поиск» вы можете связать дополнительные фильтры (поиск) по вычисляемому результату. Это будет выполнять фильтрацию менее 1010 * калорий в одном месте. 

<v-data-table :items="currentItems" />
...