for loop in react

Question

I got this function working to get some gym classes from a .json file.

    filtrarClase(dia, hora) {
    let data = this.state.data
    return data.filter(cl         


        

Answer 1

Reason is, for loop is used to iterate the array it will never return anything, if you want to return something then use map.

Write it like this:

actualizarLista(dia){
    const horas = ['07:30','08:15','08:30','09:30','10:30','15:00','15:15','15:30','17:30','18:00','18:15','18:30','19:00','19:30','20:00','20:30','21:30']
    return horas.map((el, i) => {
        return <ul className="horario-item">{this.filtrarClase(dia, el)}</ul>
    })
}

render() {
    let dias = [1,2,3,4,5,6];
    let uiItems = dias.map(i => {
        return  <div className="horario-container" key={i}>
                    {this.actualizarLista(i)}
                </div>            
    })       

    return (
        <div className="App">
            {uiItems}
        </div>  
    )      
}

Suggestion: horas array is constant so i will suggest you to define it once outside of the class.