Как разбить на страницы отфильтрованные данные, используя ramda и vue - PullRequest
0 голосов
/ 06 июля 2019

Я пытаюсь создать страницу со списком электронной торговли с левой боковой панелью, имеющей различные фильтры, а с правой стороны - товары, использующие ramda и vue. У меня 2 проблемы:

(1) Я пытаюсь отфильтровать цену товара в диапазоне 1-100.

(2) Я не могу разбить фильтрованные продукты на страницы.

Проблема 1: Я передаю [0,1,2,3,4, ...., 99,100] и пытаюсь отфильтровать 99 из него, используя "include ()", но код не может отфильтровать что в обычном JS должно, но я не знаю, почему ramda.js фильтрует только точные слова или цифры.

Проблема 2: Пока продукты загружаются, нумерация страниц работает нормально, но когда я фильтрую, я хочу показать 10 элементов на странице; он просто показывает 10 элементов на 1-й странице и удаляет все остальные отфильтрованные элементы, поэтому после 1-й страницы нет страниц.

Задача 1:

return R.pipe(R.pluck('product_prices'), R.uniq)(products_list)
return this.products_list.filter(
  prod => (prod.product_prices].some(val => this.filters.includes(val)) )
)

Задача 2:

if (this.currentPage >= this.totalPages) {
  this.currentPage = this.totalPages 
} 
var index = this.currentPage * this.itemsPerPage - this.itemsPerPage; 
return this.filteredProducts.slice(index, index + this.itemsPerPage);

Проблема 1: Я хочу отфильтровать цены из диапазона цен, используя ramda и vue.

Проблема 2: После применения любого фильтра я смогу увидеть все отфильтрованные продукты, разбитые на страницы.

1 Ответ

1 голос
/ 08 июля 2019

Проблема в этой строке:

this.resultCount = (!this.activeFilters.length) ? this.products.length : this.activeFilters.length

Вы не хотите считать фильтры, но отфильтрованные продукты. Как это:

this.resultCount = (!this.activeFilters.length) ? this.products.length : this.filteredProducts.length           

Вы можете увидеть это в другой скрипке . Но в следующий раз, пожалуйста, оставьте свой код здесь. Ссылка Fiddle - это хорошее дополнение, но все, что имеет отношение к делу, также должно появиться в вопросе Размещенного вами кода недостаточно для демонстрации вашей проблемы.

...