How to create a Vue.js moment date filter
In Vue.js I’m currently working on building a table that lists blog posts and one of the columns includes the date the blog post was published. The dates coming back from the server are not formatted so I wanted to hook up a date filter, this is how I did it inside of my blog post component:
var BlogPosts = {
template: `\
...
<div class="col-md-2">\
\
</div>\
...
',
data: function() {
//...
},
filters: {
truncate: function(value) {
//...
},
YYYYMMDD: function(date) {
return moment(date).format('YYYY-MM-DD');
}
},
methods: {
//...
},
mounted: function() {
//...
}
};
Apparently filter names can’t have -
in them, so keep that in mind is you
build yours.
Also this filter is tied to my component, but it is something I might want to use in other components so I might need to move it out into my main app.js file.