how to add minutes to Date() in react-native?

Question

I want to add 5 minutes to current time and store it to this.state.date.

However,

this.setState({
    date: new Date() + new Date(0,0,0,0,0,5,0),
});

gives me some strange error, saying

`props.date.getTime is not a function. (In 'props.date.getTime()', 'props.date.getTime' is undefined)

DatePickerIOS_render DatePickerIOS.ios.js:125

EDITED: According to this post I also tried below,

this.setState({
    date: this.state.date.setMinutes((new Date()).getMinutes()+5)
});

but it still gives me the same error message. What is the correct way to add minutes to Date() in react-native?

Btw, I'm using datepickerios on another part of the app, and not sure why the error is related to DatePickerIOS.ios.js in the first place. The other part of the app which actually uses the DatePickerIOS works fine without error.

EDITED AGAIN:

Below is the full function. This function is called from a SegmentedControlIOS which has values ['5min from now', '15min from now', '30min from now', 'custom'].

_onTimeChange = (event) => {

    switch (event.nativeEvent.selectedSegmentIndex) {
        case 0:
        // 5min
            return this.setState({
                date: this.state.date.setMinutes((new Date()).getMinutes()+5),
                time: this.state.date.toLocaleTimeString()
            });
        case 1:
        // 15min
            return this.setState({
                date: this.state.date.setMinutes((new Date()).getMinutes()+15),
                time: this.state.date.toLocaleTimeString()
            });
        case 2:
        // 30min
            return this.setState({
                date: this.state.date.setMinutes((new Date()).getMinutes()+30),
                time: this.state.date.toLocaleTimeString()
            });
        case 3: 
        // show modal with datepicker (this one works fine)
            return this.setModalVisible(true);
    }
  }

What happens: If I change selection from the segmented control once, a yellow warning bar with props error message is shown at the bottom of my simulator. If I change selection once again, then the red screen shows up with '_this5.state.date.setMinutes is not a function'.

So it looks like

date: this.state.date.setMinutes((new Date()).getMinutes()+5)

does add minutes, but when I do it twice it ends up in error. Please help!

Possible duplicate of [How to add 30 minutes to a JavaScript Date object?](http://stackoverflow.com/questions/1197928/how-to-add-30-minutes-to-a-javascript-date-object) — Kerumen, Oct 05 '16 at 16:22
Well, that's where I got the idea of this.state.date.setMinutes((new Date()).getMinutes()+5), but it doesn't work... — Younghak Jang, Oct 05 '16 at 16:24

leo7r · Accepted Answer · 2016-10-05T17:27:59.450

3

Try this:

var d = new Date(); // get current date
d.setHours(d.getHours(),d.getMinutes()+5,0,0);

EDIT

var d = new Date(); // get current date
d.setHours(d.getHours(),d.getMinutes()+5,0,0);
this.setState(date:d,time:d.toLocaleTimeString());

edited Oct 05 '16 at 17:27

answered Oct 05 '16 at 16:48

leo7r

10,468
1
22
26

var d = new Date(); ... this.setState({ date: d.setHours(d.getHours(),d.getMinutes()+5,0,0), time: this.state.date.toLocaleTimeString() }); also gives me error – Younghak Jang Oct 05 '16 at 16:56
No, d.setHours doesn't return a new date, it modifies the current variable. Check out my edit – leo7r Oct 05 '16 at 17:27
Hmm..interesting. I've put var d=new Date(); into _onTimeChange function and it is causing 'Maximum call stack size exceeded' error. I'm not using loop but something is causing infinite loop now... – Younghak Jang Oct 06 '16 at 05:10
Maximum call stack error was related with some other part of the code. I finally got it working correctly! Thanks!!! – Younghak Jang Oct 06 '16 at 06:28

how to add minutes to Date() in react-native?

1 Answers1