Why is the .map() function not iterating?

Advertisements

I am trying to iterate through my state via .map(), but the function stops after the first return:

private renderEmployeesTable() {
if (this.state.employees) {


  return new Array(this.state.employees).map((_, index) => {



    const employeeId: string | undefined =
      this.state.employees[index]?.employeeId;
    const employeeName: string | null = this.state.employees[index]?.name;
    return (
      <>
        <div className="row">
          <div className="col">
            <p className="rowText">{employeeId}</p>
          </div>
          <div className="col">
            <p className="rowText">{employeeName}</p>
          </div>
          <div className="col">
            <p className="rowText">
              {
                this.state.workingHoursForEveryEmployee.find(
                  (res) => res.employeeId === employeeId
                )?.workingHours
              }
            </p>
          </div>
          <div className="col">
            <p className="rowText">{this.state.hoursToWork}</p>
          </div>
        </div>{" "}
      </>
    );
  });
}

}

In the console, index is 0 and doesn’t go up.
Do you have any idea, how I could fix this?

>Solution :

Your are creating a new Array() which contains only 1 item: an array.

You probably don’t need the new Array() part, just map this.state.employees directly.

Leave a ReplyCancel reply