how to call a function inside vue-tables2 templates option

Question

I am using vue-tables2 in my app.With the help of 'template' property avilable in vue-table2 options I am able to modify the format of the data.

The sample code is given below

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

The code works fine, but when I trying to call a function inside the template it's showing below error

TypeError: this.test is not a function

How can I call a function inside vue-table2 template property?

score 0 · Answer 1 · answered Jan 14 '20 at 07:12

this refer current fuction scope . You use inside erase function so that this refer to erase function , not vue instance .

You can do by setting global variable window but I am not quite recommend that .

Example

set vue instance in mounted scope

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

Then use in your erase scope like below

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

how to call a function inside vue-tables2 templates option

1 Answers1