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

【问题标题】：how to call a function inside vue-tables2 templates option如何在 vue-tables2 模板选项中调用函数
【发布时间】：2020-04-30 19:45:12
【问题描述】：

我在我的应用程序中使用 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 模板属性中调用函数？

【问题讨论】：

标签： vuejs2 vue-tables-2

【解决方案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();
}

【讨论】：