vue.js - 在 vue 指令中使用全局函数

Question

我正尝试在 vue 指令中使用 lodash 方法 (_.isEmpty)，如下所示:

<div class="post" v-for="post in posts"></div>
    ...
    <div class="comments" v-if="! _.isEmpty(post.comments)">
      <div class="comment" v-for="comment in post.comments"></div>
    </div>
    ...
</div>

但出现以下错误:

Uncaught TypeError: Cannot read property 'isEmpty' of undefined

看起来 vue 正在寻找当前范围内的 _.isEmpty 方法。在这种情况下我应该如何调用全局函数？

Answer 1

您只能在模板中访问当前 Vue 实例/组件的功能:

• 数据
• Prop
• 方法

不能运行“第三方”代码。

因此，您必须在 Vue 组件中创建一个方法来代理 lodash 方法:

methods: {
  isEmpty: function (arr) { return _.isEmpty(arr)}
}

并在模板中使用此方法:

<div class="comments" v-if="! isEmpty(post.comments)">