如何使用Ramda和Vue对已过滤的数据进行分页

阿米塔瓦·德布(Amitava Deb)

我正在尝试制作一个电子商务列表页面,左侧栏具有不同的过滤器,右侧栏具有使用ramda和vue的产品。我有2个问题:

(1)我正在尝试将产品价格过滤为1-100。

(2)我无法对已过滤的产品进行分页。

问题1:我传递[0,1,2,3,4,....,99,100],我试图使用“ includes()”从其中过滤掉99,但是代码无法正常过滤JS应该但是我不知道为什么ramda.js只过滤确切的单词或数字。

问题2:在装入产品时,分页工作正常,但是当我进行过滤时,因为我希望每页显示10个项目;它仅在第一页中显示10个项目,并丢弃所有其他已过滤的项目,因此在第一页之后没有页面。

问题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:应用任何过滤器后,我应该能够看到所有过滤后的产品均已分页。

斯科特·索耶(Scott Sauyet)

问题在这一行:

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

您不想计算过滤器,但要计算过滤的产品。像这样:

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

您可以在另一个小提琴中看到它但是下次,请在此处发布您的代码。Fiddle链接是一个不错的选择,但所有相关的内容也应出现在问题中。您发布的代码不足以证明您的问题。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

如何使用firestore对过滤的数据进行分页

如何使用AngularJS和目录分页对类别进行过滤

如何对已过滤的数据表上的每一行进行过滤和执行组操作

Ramda:如何使用嵌套对象过滤数据?

如何使用ReactJs和Hooks对Cloud FireStore数据进行分页

jQuery数据表:使用Ajax分页进行搜索和过滤

对关系表数据进行分页、排序和过滤

Angular.js对已过滤的数据进行分页并显示总项目,而无需在视图/控制器中重复代码

使用 ListView 和动态/过滤查询集进行分页

如何使用Vue组件JS和Axios Router-View在Laravel中进行分页

Laravel雄辩的分页,如何在使用过滤器进行分页之前进行计数?

如何过滤已过滤?

如何使用查询限制,偏移量和jquery数据表进行分页?

我使用 mvc 分页丢失了过滤数据,而我使用视图模型而不是文本进行过滤

通过API对未排序和过滤的数据库数据进行分页的最佳方法是什么?

使用 vue + laravel 进行分页

Vue分页-如何使用?

使用NodeJS和Mongoose进行分页从MongoDB检索数据

如何使用 AND 和 OR 语句进行过滤?

在使用Recyclerview + GSON进行分页时如何防止数据清除

如何使用ReactJs对Cloud Firestore数据进行分页

如何使用Liquid来对Jekyll的数据项进行分页

VueJs如何使用限制器和范围进行分页?

如何使用MySQL和PHP对多个搜索结果进行分页?

将来如何使用Dispatch和Scala对REST呼叫进行分页

使用过滤器 knp 分页器进行分页

如何使用引导程序分页器库对从PHP回显的数据进行分页?

如何在反应中使用分页,以便对来自api的数据进行分页

如何使用Codeigniter中的分页库对数据表进行正确的分页