JavaScript Vuex or Date bugs

Question

I have a problem with the Date Class. It should take a parameter (wheres a timestamp in) and output the right day of month and the month. But it always shows something like 02.06. Everything from past month instead of current Date.

Here is my part where I pass Timestamp to getter

<workCard v-if="services_getSort(sortServicesBy).length > 0" v-for="i in services_getSort(sortServicesBy).data" :key="i.source">
  <div slot="content" class="d-flex justify-content-between ">
    <router-link :to="'/services/' + i">
      <div style="min-width:4.0rem" class="pr-1 align-items-center">
        <span style="color:black;"><i class="fas fa-calendar-alt fa-md"></i> {{outputDateOnly(i.start)}}</span>
        <br>
        <span style="color:darkblue"><i class="fas fa-clock fa-md"></i> {{outputTimeOnly(i.start)}}</span>
      </div>
    </router-link>
    <div class="p-1 d-flex mt-2">
      <span style="color:black">></span>
    </div>
    <div style="min-width:4.0rem" class="align-items-center">
      <span v-if="i.end != ''">
                                <span style="color:black;"><i class="fas fa-calendar-alt fa-md"></i> {{outputDateOnly(i.end)}}</span>
      <br>
      <span style="color:darkblue"><i class="fas fa-clock fa-md"></i> {{outputTimeOnly(i.end)}}</span>
      </span>
      <i v-if="i.end == ''" class="fas mt-3 fa-infinity fa-md"></i>
    </div>

And here is my getter function which should handle this raw timestamp

export const outputDateOnly = (state, getters) => {
  return payload => {
    let check = getters.zeroCheck;
    let date = new Date(payload)
    console.log(payload);

    console.log(`${date.getDay()}.${date.getMonth()}`);

    return `${date.getDay().toString()}.${date.getMonth().toString()}`
  }
}

My Timestamp Format comes from HTML input type="date" and looks like this 2018-07-17T10:10

I hope someone knows the solution

Re `date.getMonth()`, months are zero indexed (6 is July). This is a duplicate, just need to find one. Incidentally, what is the value of *payload*? See [*Why does Date.parse give incorrect results?*](https://stackoverflow.com/questions/2587345/why-does-date-parse-give-incorrect-results) — RobG, Jul 16 '18 at 08:09
The value is for example 2018-07-17T10:10 But it doesnt matter if its the 17th it outputs 3th or 6th — EGNdev, Jul 16 '18 at 08:12
Note that `new Date('2018-07-17T10:10')` is (incorrectly) treated as UTC by Safari. Don't use the built-in parser. — RobG, Jul 16 '18 at 08:13
You can write your own parser for that format in 2 lines of code, or use a library like [*moment.js*](http://momentjs.com) or [*fecha.js*](https://github.com/taylorhakes/fecha). — RobG, Jul 16 '18 at 08:20
Thank you for this recommendation and it worked out. But still I have this day issue that it doesnt show the 1:1 day what ive set for example 2018-10-12 string give me 6.9.2018 For no reason — EGNdev, Jul 16 '18 at 08:38

score 0 · Accepted Answer · answered Jul 16 '18 at 10:38

0

I'Ve found the solution through a tip from RobG >

Note that new Date('2018-07-17T10:10') is (incorrectly) treated as UTC by Safari. >Don't use the built-in parser. – RobG 2 hours ago I replaced my Date Class with moment.js and changed my Timestamp format which i pass to moment.js class

Thank you @RobG

answered Jul 16 '18 at 10:38

EGNdev

40
8

Ah, just use `new Date(2018, 6, 17, 10, 10, 0)` if the time represents local and `new Date(Date.UTC(2018, 6, 17, 10, 10, 0))` if the time is UTC. Extracting year, month and etc should be easy with String.substring – Salman A Jul 16 '18 at 20:17

JavaScript Vuex or Date bugs

1 Answers1