I have this page where I give the details of a reservation and I need to allow users to change the date.
I created 2 properties in the state and loaded them with the same exact object gathered from the backend so that I can compare them later.
When the user changes the date only one of them gets updated with set state and the re-render triggers a function that checks if any changes are made.
dataDidChange(){ let reservationChanged = this.state.reservation.startAt === this.state.originalReservation.startAt && this.state.reservation.endAt === this.state.originalReservation.endAt; console.log('DataChanged: ',reservationChanged); return !(reservationChanged); }
The problem is that apparently changing one changes the other too.
this.setState({ reservation: resp, // resp is the response from the backend originalReservation: resp, // this state parameter isn't called anywhere else });
I have 2 others state setting below but both of them only set reservation
and not originalReservation
, but both of them change anyway. How can I avoid this?
I tried with temporary variables before setting, I tried creating new Date objects with the same value, but nothing has worked.
let reservation = resp;let original = resp;original.startAt = new Date(original.startAt.getDate() + original.startAt.getTime());