vuejs2 - 如何在 vue-tables2 模板选项中调用函数

Question

我在我的应用程序中使用 vue-tables2。借助 vue-table2 选项中可用的“模板”属性，我可以修改数据的格式。

示例代码如下

data: {
    columns: ['erase'],
    options: {
        ...
        templates: {
            erase: function (h, row, index) {
                return this.test();
            }
        }
        ...
    },
    methods: {
        test() {
           return 'test';
        }
    } 
}

代码工作正常，但是当我尝试在模板中调用函数时，它显示以下错误

TypeError: this.test is not a function

如何在 vue-table2 模板属性中调用函数？

Answer 1

this参考当前功能范围。您使用内部erase函数，以便this引用擦除函数，而不是 vue 实例。

您可以通过设置全局变量来做到这一点，window但我不太推荐这样做。

例子

在挂载范围内设置 vue 实例

mounted: function() {
  window.vm = this // assign vue instance to global window 
}

然后在您的擦除范围中使用，如下所示

erase: function (h, row, index) {
   return window.vm.test();
}