[Solved] [V1] QDate does not work with Unix timestamp but it works in V0.17.x with QDatetime

  • In V0.17.x, there is a component called QDatetime, it works well with Unix timestamp or a String representing a date(E.g. 1497159857411, Sun Jun 11 2017 08:44:42 GMT+0300).

    In V1 version, I tried below two methods, neither is working.

    <q-input v-model="date" filled type="date" hint="Native date"/>

    It only accepts date format yyyy-mm-dd

    <q-input filled v-model="date" mask="date" :rules="['date']">
      <template v-slot:append>
        <q-icon name="event" class="cursor-pointer">
          <q-popup-proxy ref="qDateProxy" transition-show="scale" transition-hide="scale">
            <q-date v-model="date" @input="() => $refs.qDateProxy.hide()" />

    It only accepts the string date format with different mask, but not including Unix timestamp.

    I know we can use below function to do it, but it needs additional effort every time.

    import { date } from 'quasar'
    let timeStamp = Date.now()
    let formattedString = date.formatDate(timeStamp, 'YYYY-MM-DDTHH:mm:ss.SSSZ')

  • Maybe this might get you where you want to be?



  • @s-molinari Thanks Scott!
    But I am afraid this may not solve my problem.
    My issue is for example, I got some date data from API call, the date format is Unix timestamp (E.g. 1497159857411), so how to show it using QDate?

    I know I can use the syntax date.formatDate(timeStamp, ‘YYYY-MM-DD’) to convert it manually, but it needs the extra effort every time. As you know, QDatetime in V0.17.x supports Unix timestamp.

    So is that possible that QDate supports Unix timestamp directly?

  • No. Unfortunately not, AFAIK. You have to reformat it to the new date format. You could create your own custom date input component, which has a “built-in” reformatting. So, you make it only once and use it everywhere. 😄


  • @s-molinari Get it. Thanks for your help!

  • Admin

  • @rstoenescu I may not catch you point. Do you mean it is not possible to accept Unix timestamp?

  • No. You can work with Unix timestamps, you just have to reformat the timestamp to a format the component will work with. The formatting Razvan linked to is for formatting the text output of QInput (which you’d need for making your custom date/time component).


Log in to reply