Question

我使用vuetify：https://vuetifyjs.com/en/ 我想使用moment.js。因此，我阅读了以下参考资料：https://www.npmjs.com/package/vue-moment

我已经跑过npm install vue-moment

我还是很困惑把这个脚本Vue.use(require('vue-moment'));

在vuetify中，存在两个文件：main.js和index.js

main.js像这样：

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store/index'
import './registerServiceWorker'
import vuetify from './plugins/vuetify'

Vue.config.productionTip = false

new Vue({
  router,
  store,
  vuetify,
  render: h => h(App)
}).$mount('#app')

index.js像这样：

import Vue from 'vue';
import Vuex from 'vuex';
import dataStore from './modules/data-store';
import createLogger from "vuex/dist/logger";
Vue.use(Vuex);
const debug = process.env.VUE_APP_DEBUG !== "production";
export default new Vuex.Store({
  modules: {
    dataStore
  },
  strict: debug,
  plugins: debug ? [createLogger()] : []
});

我将Vue.use(require('vue-moment'));放在哪里？

我尝试将其放在main.js中，但是如果我调用vue组件，则会出现错误：ReferenceError: moment is not defined

我的Vue组件是这样的：

<template>
  ...
</template>

<script>
export default {
  mounted() {
    let a = moment("2012-02", "YYYY-MM").daysInMonth();
    console.log(a)
  }
};
</script>

Answer 1

我在vue-moment npm页面的底部找到了这个

vue-moment attaches the momentjs instance to your Vue app as 
this.$moment.

This allows you to call the static methods momentjs provides.

因此，您应该能够使用vue-moment的原始配置，并通过mounted()方法进行操作

 mounted() {
    let a = this.$moment("2012-02", "YYYY-MM").daysInMonth();
    console.log(a)
 }

通知this.$moment

对于vue-moment的设置，应将其放置在main.js文件中

main.js

Vue.use(require('vue-moment'))

================================================ ========================

全球

如果您想在Vue中全局使用moment，则可以创建一个Instance Proprety

main.js

import moment from 'moment'

Vue.prototype.moment = moment

然后在您的组件中，在方法或计算的属性中调用this.moment。在您的mounted部分中，看起来像这样

 mounted() {
   let a = this.moment("2012-02", "YYYY-MM").daysInMonth();
   console.log(a)
 }

组件

如果您只想在组件中使用moment，则可以像这样直接添加

<script>
import moment from 'moment'
export default {
  mounted(){
    let a = moment("2012-02", "YYYY-MM").daysInMonth();
    console.log(a)
}
}
</script>

如何在vuetify中设置moment.js？

1 个答案: