如何使用react js根据评分对数据进行排序

Question

我的数据库是这样的。我想创建一个过滤器，将返回最高评级的数据

{
_id:61f24397e8192a0a5994aaa8
title:"title"
expense:"50"
ratings:"5"
date:"2022-01-28"
time:"10"
category:"k"
location:"1010"
description:"101010"
}

我试着喜欢这个，但收到了一个错误Sidebar.js:14 Uncaught (in promise) TypeError: parseInt(...).sort is not a function

useEffect(() => {
setIsLoading(true)
fetch(`http://localhost:5000/blogs`)
.then(res => res.json())
.then(data => {
const approvedBlogs = data.filter(blogs => parseInt(blogs.ratings).sort((a, b) => b - a))
// const approvedBlogs = data.filter(blogs => blogs.ratings === '5')
setBlogs(approvedBlogs)
})
.finally(() => setIsLoading(false))
}, [])

Answer 1

您可以直接对数据进行排序，而无需过滤

useEffect(() => {
setIsLoading(true)
fetch(`http://localhost:5000/blogs`)
.then(res => res.json())
.then(data => {
data.sort((a, b) => {
const parsedA = parseInt(a.ratings, 10);
const parsedB = parseInt(b.ratings, 10);
return parsedA > parsedB ? -1 : 1; // for descending sort inverse -1 and 1
});
setBlogs(data)
})
.finally(() => setIsLoading(false))
}, [])

Answer 2

确实，您正在尝试对整数而不是数组进行排序。

更改此行：

const approvedBlogs = data.filter(blogs => parseInt(blogs.ratings).sort((a, b) => b - a))

到此：

const approvedBlogs = data.sort((a, b) => (+a.ratings > +b.ratings ? -1 : 1));

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort

Answer 3

您可以使用.filter丢弃您不再想要的博客(如评论行(。之后，使用.sort按评级排序数据。它应该看起来像：

const approvedBlogs = data.filter(blogs => blogs.ratings === '5')
.sort( (a, b) => return parseInt(b.rating) - parseInt(a.rating)