Estoy pasando a través de una variable llamada 'homeTeam' y cuando la consola registró la salida
abbreviation: "Uls" id: "08ew458ius6f" name: "Ulster"Una variable llamada 'awayTeam' genera la misma matriz pero con datos de un equipo diferente
Tengo un poco de código para averiguar si necesito la abreviatura homeTeam o awayTeam;
const restartTeamAbbrevation = async (homeTeam, startTeamId, awayTeam) => { if (startTeamId == {homeTeam.id} ) { return homeTeam.abbreviation } else { return awayTeam.abbreviation }}Luego quiero que este valor aparezca en mi interfaz, estoy intentando usar el siguiente código;
<Modal.Body> <Row> <Col> <div className="d-flex"> <span className="py-1">Team: </span> <span className="py-1">{ restartTeamAbbrevation() }</span> </div> </Col> </Row> </Modal.Body>me sale el error
Unhandled Rejection (TypeError): Cannot read properties of undefined (reading 'id')Porque cuando está llamando a esa función, no está pasando los parámetros como homeTeam, startTeamId, awayTeam, por lo que cuando se llama a la función, estos valores son iguales a indefinidos y cuando intenta acceder a homeTeam.id dentro de la función, le da ese error .
Intente pasar argumentos a su función restartTeamAbbreviation. Algo como esto:
<Modal.Body> <Row> <Col> <div className="d-flex"> <span className="py-1">Team: </span> <span className="py-1">{ restartTeamAbbreviation(homeTeam, startTeamId, awayTeam) }</span> </div> </Col> </Row> </Modal.Body>También tiene alguna condición extraña, es posible que desee hacer esto en su lugar:
if (startTeamId === homeTeam.id ) ...Y una cosa más, la función restartTeamAbbreciation no necesita ser asíncrona