React rendering view from array in state

Question

I have trying about not been able to figure out the reason. I have a state variable which gets updated in constructor

renderUpcomingReminders(){
    const upComingReminders = _.map(this.state.upComingReminders,(reminder, key) =>{
      if(!reminder.edit){
        return(<Row >
          <Col sm={12}>
            <div className="products" >
              <h4 className="content"> <span className="glyphicon glyphicon-unchecked"> </span> {typeof reminder !== 'undefined'?reminder.message: null}
                <span className="badge badge-default">{typeof reminder !== 'undefined'?moment(reminder.scheduled_datetime).format('MMMM DD at hh:mm a'): '-'}</span></h4>
              <div className="pull-right">
                <Button bsStyle="primary" onClick={()=>{this.editReminder(key)}}>Edit</Button>
                <Button bsStyle="danger" >Remove</Button>
              </div>
            </div>
          </Col>
        </Row>);
      }else {
        return (<Row key={key.toString()}>
          <Col sm={12}>
            Edit here.
          </Col>
        </Row>);
      }
    });
    console.log(112);
    return upComingReminders;
  }

So this function is to render the reminders according to the edit flag.

<Col sm={12}><h4><a className="heading">Upcoming Reminders</a></h4></Col>
                {()=>{this.renderUpcomingReminders()}}

This is how I am calling the function to render the result. Now problem is that the function is not logging the value in console .log function.

I am confused with React's iteration and conditional rendering.

{()=>{this.renderUpcomingReminders()}} You aren't calling the function here, you're creating another function that calls renderUpcomingReminders.. So I think what you want is {this.renderUpcomingReminders()} — André Junges
– André Junges, Commented Jun 21, 2017 at 0:36

Piyush Dhamecha · Accepted Answer · 2017-06-21 08:36:43Z

1

Replace {()=>{this.renderUpcomingReminders()}} with {this.renderUpcomingReminders().bind(this)}

answered Jun 21, 2017 at 8:36

Piyush Dhamecha

1,5151 gold badge15 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

React rendering view from array in state

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related