Momento.js con Vuejs

Intento imprimir la fecha y hora usando como el siguiente en vue-for 

{{ moment().format('MMMM Do YYYY, h:mm:ss a') }}

Pero, no aparece. Es sólo un espacio en blanco. ¿Cómo puedo intentar usar moment en vue?

Author: Set Kyar Wa Lar, 2015-12-16
Source

4 answers

Con su código, el vue.js está tratando de acceder al método moment() desde su ámbito.

Por lo tanto, debe usar un método como este: 

methods: {
  moment: function () {
    return moment();
  }
},

Si desea pasar una fecha a la moment.js, le sugiero que utilice filtros: 

filters: {
  moment: function (date) {
    return moment(date).format('MMMM Do YYYY, h:mm:ss a');
  }
}

<span>{{ date | moment }}</span>

[demo]

 121
Author: Pantelis Peslis,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-07-30 20:53:13

Si su proyecto es una aplicación de una sola página, (por ejemplo, proyecto creado por vue init webpack myproject), Encontré que esta manera es más intuitiva y simple:

En main.js 

import moment from 'moment'

Vue.prototype.moment = moment

Luego, en su plantilla, simplemente use 

<span>{{moment(date).format('YYYY-MM-DD')}}</span>
 42
Author: Geng Jiawen,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-03-30 08:58:04

En su package.json en la sección "dependencies" agregue el momento: 

"dependencies": {
  "moment": "^2.15.2",
  ...
}

En el componente donde te gustaría usar moment, impórtalo: 

<script>
import moment from 'moment'
...

Y en el mismo componente añadir una propiedad calculada: 

computed: {
  timestamp: function () {
    return moment(this.<model>.attributes['created-at']).format('YYYY-MM-DD [at] hh:mm')
  }
}

Y luego en la plantilla de este componente: 

<p>{{ timestamp }}</p>
 20
Author: Paweł Gościcki,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-11-05 11:42:59

Hice que funcionara con Vue 2.0 en un solo componente de archivo.

npm install moment en la carpeta donde tiene vue instalado

<template>
  <div v-for="meta in order.meta">
    {{ getHumanDate(meta.value.date) }}
  </div>
</template>
<script>
    import moment from 'moment';
    export default {
         methods: {
            getHumanDate : function (date) {
                return moment(date, 'YYYY-MM-DD').format('DD/MM/YYYY');
            }
        }
    }
</script>
 8
Author: max,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-12-24 11:42:59