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