loading...

How to format dates in Vue

Joe Erickson on July 19, 2019

If you've used Vue for any length of time, you soon find that it doesn't have a lot of the fancy formatting options that some of the other framewor... [Read Full]
markdown guide
 

You can also define a global filter for using in all components:

// main.js

import Vue from "vue";
import VueResource from "vue-resource";

// Other code...

Vue.filter("capitalize", text => {
    return text ? text.charAt(0).toUpperCase() + text.slice(1) : "";
});

//Other code...

new Vue({
    router,
    store,
    render: h => h(App)
}).$mount("#app");

Tested on single file components. Perhaps is the same with CDN version.

 

Yes. The filters are pretty handy. I'm planning writing a post about them soon. Thank you for pointing this out!

 

Wow! This could have saved me a bunch of time 😅 I've been using moment imported separately in my app 🙃

 

I was the same way! I think Moment is the answer everyone gives, but it's so much overkill for simple date formatting. I hope you find this useful for future projects!

 

Surprised to see no mention of Intl. :) I wrote up an article on using Vue with it: vuejsdevelopers.com/2018/03/12/vue...

 

Moment.js interesting library, I already want to use it !!!!1

 
code of conduct - report abuse