CODEWITHSUNDEEP
reactjs
Dawn17
Dawn17

Reputation: 8297

Mapping state to component in react

My component has this state

    this.state = {
        open: false,
        schedules: [
            { startDate: '2018-10-31 10:00', endDate: '2018-10-31 11:00', title: 'Meeting', id: 0 },
            { startDate: '2018-11-01 18:00', endDate: '2018-11-01 19:30', title: 'Go to a gym', id: 1 },
          ]
    };

In my render function I tried to render the items like

render() {
    return (
        <div className="row center">
            <div className="col-md-6">
                <div>
                {
                    this.state.schedules((obj, idx) => {
                        return (
                            <div key={idx}>
                                {console.log(obj)}
                            </div>
                        )
                    })
                }
                </div>
            </div>
        </div>
    );

I expected to get the object in the this.state.schedules printed out in the console, but I get the error that says TypeError: this.state.schedules is not a function.

What am I doing wrongly?

Upvotes: 0

Views: 1018

Answers (1)

EGN
EGN

Reputation: 2572

this.state.schedules is not a function. it is an array... You need to loop through it... try code below

this.state.schedules.map((obj, idx) => {
    return (
        <div key={idx}>
            {console.log(obj)}
        </div>
    )
})

Upvotes: 1

Related Questions