I have a database and I am trying to sort through the data in the database and find the one that has a name property equal to the id variable that I specified. The id variable works though I am having trouble sorting through and finding the name property equal to the id variable. This what I have tried:
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;
I think the problem is assigning the value to the object or sorting through. I appreciate any responses.
I am not actually sure why you filtering your data object without taking your student ID in your consideration, but what I am going to do is to
Object.keys(data).filter(element => element.id === id ).map(student => {
// You will be able to find your current **student** right her
console.log(student);
})
There is no need to use the Data object again in your if condition
Sorry. It was a dumb mistake. I did response => response.json forgetting the parenthsis.