Soy un principiante en React. Me gustaría cambiar el color de la credencial en función del número de alumnos registrados. Algo como en la imagen. Si item.registeredCount (número de estudiantes registrados) = (item.capacity - 1), entonces el color será rojo (por ejemplo, 1/2, 4/5, 10/11, etc.), de lo contrario, el color de la insignia será verde porque la capacidad no está a la mitad. En caso de que item.capacity = 1, el color de la insignia será verde.
Mi código:
<Col className="text-center"> <div> <Badge bg="danger">{item.registeredCount} / {item.capacity} </Badge> </div> </Col>Para resolver su problema, puede usar el operador ternario ( Documentación ) para elegir el color de su credencial.
<Badge bg={(item.registeredCount === item.capacity - 1) ? "green" : "danger"}>{item.registeredCount} / {item.capacity} </Badge>