Moment.js с Vuejs

Ответ 1

С помощью вашего кода vue.js пытается получить доступ к методу moment() из своей области.

Следовательно, вы должны использовать такой метод:

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

Если вы хотите передать дату в moment.js, я предлагаю использовать фильтры:

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

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

[demo]

Ответ 2

Если ваш проект является одностраничным приложением (например, проект, созданный vue init webpack myproject), Я нашел этот способ наиболее интуитивным и простым:

В main.js

import moment from 'moment'

Vue.prototype.moment = moment

Затем в вашем шаблоне просто используйте

<span>{{moment(date).format('YYYY-MM-DD')}}</span>

Ответ 3

В разделе package.json в разделе "dependencies" добавьте момент:

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

В компоненте, где вы хотите использовать момент, импортируйте его:

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

И в том же компоненте добавьте вычисленное свойство:

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

И затем в шаблоне этого компонента:

<p>{{ timestamp }}</p>

Ответ 4

Я работал с Vue 2.0 в одном файле.

npm install moment в папке, где установлена ​​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>

Ответ 5

Я просто импортировал бы модуль момента, затем использовал вычисляемую функцию для обработки моей логики moment() и возвращал значение, указанное в шаблоне.

Хотя я не использовал это и, следовательно, не могу говорить об его эффективности, я нашел https://github.com/brockpetrie/vue-moment для альтернативного рассмотрения

Ответ 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

Ответ 7

vue-moment

очень хороший плагин для проекта VUE и работает очень гладко с компонентами и существующим кодом.  Наслаждайся моментами... 😍

// in your main.js
Vue.use(require('vue-moment'));
// and use in component
{{'2019-10-03 14:02:22' | moment("calendar")}}
// or like this
{{created_at | moment("calendar")}}