VUE Moment.js does not update the date in real time

Asked

Viewed 143 times

0

I am starting the use of the Moments library of VUE.JS, I have a message area on my site and I need the date to be shown as: "Posted 5 minutes ago", I was able to show the date with the code below, but I notice that it only updates with refresh, doesn’t get reactive, which I may have done wrong?

<script src="https://momentjs.com/downloads/moment.js"></script>

<div id="app-ask-marketplace">
    <div>{{moment(item.date, "YYYY-MM-DD hh:ii").fromNow()}}</div>
</div>



<script>
    new Vue({
        el:"#app-ask-marketplace",
        data : {

        },

        methods : {


        },  mounted(){ 

        }

    })
</script>
vue.js

  • Ever tried to change the Mounted for updated?

  • Would that be something like? https://jsfiddle.net/7afnyr9j/

1 answer

0

Within the template "global" variances within the module are not accessible, if you want to use them you have to associate to the instance, for example in data.

But in your case you can do it with a computed, or with a filter if the item is being created inside a v-for:

<div>{{item.date | yymmdd}}</div>

And in the JS:

filter: {
    yymmdd(date ){
       return moment(date, "YYYY-MM-DD hh:ii").fromNow();
    }

Or as I explained above:

In the JS:

import moment from 'moment';

...
  data: {
    moment: moment

And in the template:

<div>{{moment(item.date, "YYYY-MM-DD hh:ii").fromNow()}}</div>

Browser other questions tagged vue.js

You are not signed in. Login or sign up in order to post.