CODEWITHSUNDEEP
javascriptnode.jsvue.jsvuejs2momentjs
Echo
Echo

Reputation: 305

Vue | Problems with vue-moment.js

I'm having a problem wrapping my head around the implementation of vue-moment or moment.js inside a .vue file. So I would like to have a date inside the vue method that I can then manipulate to find a time span between a past time and a current time and update it live. All the googling has pointed me towards moment.js

My main.js file has it implemented with

import VueMoment from 'vue-moment';

Vue.use(VueMoment);

I'm then trying to access the method inside the template like this

<p>{{ moment(1481889223).format('MMMM Do YYYY, h:mm:ss a') }}</p>

Is there something inherent that i'm doing incorrectly. I just cannon't seem to get the moment to output a date/time

Also if this isn't the solution is there another easy way to access date time in a .vue file?

Upvotes: 4

Views: 2719

Answers (1)

Derek Pollard
Derek Pollard

Reputation: 7165

I think what we are missing here is that vue-moment introduces moment as a filter function.

From the usage documentation:

Simply set moment as the filtering function and you're good to go. At least one argument is expected, which the filter assumes to be a format string if the argument doesn't match any of the other filtering methods.

So knowing this, we can pass the date (as long as it is properly formatted) accordingly:

<span>{{ someDate | moment("dddd, MMMM Do YYYY") }}</span>

More specific to the original post:

<p>{{ 1481889223 | moment('MMMM Do YYYY, h:mm:ss a') }}</p>

Upvotes: 5

Related Questions