[Vuejs]-Can't open modal on cellClick

0👍

User @dagalti is almost correct – in their example, this would refer to Tabulator, so you have to capture the Vue instance at an elevated scope, in a variable I have named self. See my modifications to your code, below.

mounted () {
  var self = this;

  // instantiate Tabulator when element is mounted
  this.tabulator = new Tabulator(this.$refs.table, {
    data: this.tableData, // link data to table
    layout: 'fitColumns',
    columns: [
      {title: 'Name', field: 'name', sorter: 'string', width: 200},
      {title: 'Age', field: 'age', sorter: 'number', align: 'right', formatter: 'progress'}
    ],
    cellClick: function (e, cell) {
      var name = cell.getRow().getCell('name').getValue()
      var value = cell.getValue()
      var field = cell.getField()
      console.log(name, value, field)

      self.modalShow = true;
    }
  })
}

Leave a comment