CODEWITHSUNDEEP
mysqlreactjsdate
Wesley Owen
Wesley Owen

Reputation: 33

how to render the correct date from table in mysql in react js

I'm kinda stuck I have a table with 4 readings in MySQL with different dates in the date field when I go to render them out they all show today's date... why?, what am i doing wrong? here is my code...

getReading = user_id => { const { readings } = this.state;

if (
  readings.length > 0 &&
  readings.find(reading => reading.user_id === user_id)
) {
  this.setState({
    reading: {
      ...this.state.reading,
      user_id: readings.find(reading => reading.user_id === user_id)
        .user_id,
      date: readings.find(reading => reading.user_id === user_id).date,
      sugarB: readings.find(reading => reading.user_id === user_id).sugarB,
      carbsB: readings.find(reading => reading.user_id === user_id).carbsB,
      insulinB: readings.find(reading => reading.user_id === user_id)
        .insulinB,
      insulinSB: readings.find(reading => reading.user_id === user_id)
        .insulinSB,
      insulinFB: readings.find(reading => reading.user_id === user_id)
        .insulinFB,
      sugarL: readings.find(reading => reading.user_id === user_id).sugarL,
      carbsL: readings.find(reading => reading.user_id === user_id).carbsL,
      insulinL: readings.find(reading => reading.user_id === user_id)
        .insulinL,
      hbp: readings.find(reading => reading.user_id === user_id).hbp,
      lbp: readings.find(reading => reading.user_id === user_id).lbp,
      hr: readings.find(reading => reading.user_id === user_id).hr,
      sugarD: readings.find(reading => reading.user_id === user_id).sugarD,
      carbsD: readings.find(reading => reading.user_id === user_id).carbsD,
      insulinD: readings.find(reading => reading.user_id === user_id)
        .insulinD
    }
  });
}

}; and my state looks like this... readings: [], reading: { user_id: 0, date: new Date().toLocaleDateString(), sugarB: 0, carbsB: 0, insulinB: 0, insulinSB: 0, insulinFB: 0, sugarL: 0, carbsL: 0, insulinL: 0, hbp: 0, lbp: 0, hr: 0, sugarD: 0, carbsD: 0, insulinD: 0 },

Upvotes: 0

Views: 507

Answers (1)

David Desjardins
David Desjardins

Reputation: 224

You can update your code to this one which will do the exact things but much easier to read. The date from the SQL might be null. In your render function, you probably do something like new Date("from SQL" => null).

const currentReading = readings.find(reading => reading.user_id === user_id);
if (
  readings.length &&
  currentReading
) {
  this.setState({
    reading: {
      ...this.state.reading,
      ...currentReading
    }
  });
}

Upvotes: 1

Related Questions