ReactJS.如何对数据进行排序，找到name属性与id相等的值，并将对象存储在变量中

Question

我有一个数据库，我试图通过数据库中的数据排序，并找到一个有一个名称属性等于我指定的id变量。id变量可以工作，但是我在排序和查找等于id变量的name属性时遇到了麻烦。这是我尝试过的:

import {useParams} from "react-router-dom";
function StudentInfo() {

const {id} = useParams();
var studentData = {};
function infoGetter() {

fetch(
"{url that I put in real code}"
)
.then(response => response.json)
.then(data => {
Object.keys(data).filter((element) => {
if (data[element].studentName.toLowerCase() === id.toLowerCase()) {
studentData = {
studentName: data[element].studentName,
yearGroup: data[element].yearGroup,
currentSchool: data[element].currentSchool,
parentOrGuardian: data[element].parentOrGuardian,
phoneNumber: data[element].phoneNumber,
homeAddress: data[element].homeAddress
};
}
return studentData;
}).map((filteredElement) => data[filteredElement])

})
}


return (
<div className="btn-textfield">
<button className="btn-textfield" onClick={infoGetter}>
Id: {id}
<br/><br/>
StudentInfo:
<br/><br/>
{studentData.studentName}
{studentData.yearGroup}
{studentData.currentSchool}
{studentData.parentOrGuardian}
{studentData.phoneNumber}
{studentData.homeAddress}
</button>
</div>
);
}
export default StudentInfo;

我认为问题在于给对象赋值或排序。感谢您的回复。

Answer 1

我实际上不确定为什么要过滤数据对象而不考虑您的学生ID，但我要做的是

Object.keys(data).filter(element => element.id === id ).map(student => {
// You will be able to find your current **student** right her
console.log(student);
})

不需要在if条件中再次使用Data对象

Answer 2

对不起。这是个愚蠢的错误。我做了response => response.json，忘记了括号。