类型错误：_vm.moment 不是 Vuejs 中的函数

Question

我在 Vuejs 上迁移到 moment 时遇到问题。

运行npm install vue-moment并添加到我的脚本后：

<script>

  const moment = require('vue-moment');
...
</script>

我将此添加到我的<template>：

<h1>{{moment('2017-12-20 11:00').fromNow()}}</h1>

我得到这个错误：

[Vue 警告]：渲染错误：“TypeError: _vm.moment is not a function”

Answer 1

你可以像@red-X 所说的那样全局使用它，但你只能将它添加到你的组件上：

import moment from 'moment'

export default {
   data: () => ({
      moment: moment
   })
}

然后您可以在您的 HTML 模板中访问它。

但是我建议您使用计算变量来使用这种代码，并且在您的 html 模板中没有逻辑，只需在模板中呈现计算变量以提高可读性。

使用此解决方案，您不需要在全局或组件中提供矩库，只需导入即可。

这是一个例子：

import moment from 'moment'

export default {
   computed: {
      distanceFromNow() {
         return moment('2017-12-20 11:00').fromNow()
      }
   }
}

在你的模板中：

<template>
   <div>
      {{ distanceFromNow }}
   </div>
</template>