Je suis nouveau dans JSX et j'essaie d'obtenir le nombre d'employés pour chaque équipe this.state.teams[0].employee.length me donnera le nombre d'employés pour l'objet [0] dans le tableau, comment puis-je obtenir le nombre d'employés pour chaque équipe et ne le restituer qu'une seule fois?

render() {
    const {teams, isLoading} = this.state;
    const { location } = this.props;

    if (isLoading) {
        return <p>Loading...</p>;
    }
    // console.log("Number of Employees team", this.state.teams[0].employee.length);
    

    const teamList = teams.map(team => {

        console.log("TEAM Employees", teams[0].employee.length);

        return <tr key={team.id}>
               <td>
                <div className="tableContent">
                    <div>
                         {team.name} 
                    </div>
                    <div>
                      <ul>{team.employee.map(employee => {
                       return <li key={employee.id}>{employee.name}: {employee.email}</li>
                      })}</ul>
                    </div>
                    <div>
                     {team.employee.map(employee => {
                       return <li key={employee.id}>{teams[0].employee.length}</li>
                      })}
                    </div>
                </div>                    
            </td>
        </tr>
    });
1
user2965653 6 sept. 2020 à 17:24

2 réponses

Meilleure réponse

Vous pouvez essayer ceci pour une équipe spécifique:

const teamList = teams.map(team => {
   console.log("TEAM Employees", team.employee.length);
}

Ou ceci pour le nombre d'employés dans toutes les équipes:

const numberOfAllEmployees = teams.map(team => team.employee.length).reduce((a,b) => a + b);
2
RadekDeveloper 6 sept. 2020 à 14:39

Vous pouvez utiliser Object.keys(teams[0].employee).length

La méthode Object.keys () retourne un tableau du propre objet d'un objet donné noms de propriétés énumérables, itérés dans le même ordre qu'un boucle serait. MDN

0
Ram Segev 6 sept. 2020 à 14:43