momentjs - month - vue moment

Moment.js con Vuejs

Question

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

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

pero no aparece. Es solo un espacio en blanco. ¿Cómo puedo intentar usar moment in vue?

Answer 1

Con su código, vue.js está intentando acceder al método moment() desde su alcance.

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

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

Si desea pasar una fecha al moment.js , sugiero usar filtros:

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

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

[demo]

Answer 2

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

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

En el componente donde le gustaría usar moment, impórtelo:

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

Y en el mismo componente agregue 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>

Answer 3

Lo hice funcionar con Vue 2.0 en un solo componente de archivo.

npm install moment en la carpeta donde tiene instalado vue

<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>

Answer 4

Si su proyecto es una aplicación de una sola página (por ejemplo, proyecto creado por vue init webpack myproject ), descubrí que esta forma 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>

Answer 5

Simplemente importaría el módulo de momento, luego usaría una función calculada para manejar mi lógica de momento () y devolver un valor al que se hace referencia en la plantilla.

Si bien no he usado esto y, por lo tanto, no puedo hablar sobre su efectividad, encontré https://github.com/brockpetrie/vue-moment para una consideración alternativa

Answer 6

import VueMoment from ''vue-moment'';
Vue.use(VueMoment);

const moment = require(''moment'')
require(''moment/locale/es'')

Vue.use(require(''vue-moment''), {
    moment
})

console.log(Vue.moment().locale()) //es