vue.js - TypeError : _vm. 时刻不是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 warn]: 渲染错误: "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>