Добавить событие в vue Bootstrap Datatables

Question

Я начинаю с vue и обнаружил в таблицах следующую трудность:

Я использую Vue Bootstrap Datatables https://mdbootstrap.com/docs/vue/tables/datatables/ со следующим code

  <mdb-datatable
     :data="'http://localhost/category/list_category'"
     striped
     bordered
     responsive
     lengthChange = "false"
     :tfoot="false"
     arrows
     reactive
     :time="3000"
   />

Метод list_category возвращает допустимое значение json для заполнения таблицы. Все работает отлично.

Как вы видите, я работаю с двумя столбцами, один из которых является именем, а другой - действиями по удалению и редактированию. Код, который генерирует массив строк, выглядит следующим образом:

Я использую здесь codeigniter

        $this->db->select("*");
        $this->db->from("mycategory");
        $query = $this->db->get();
        $ar = array();
        if($query->num_rows() > 0){
            foreach($query->result() as $row){
                $ar[] = array(
                    'name' => $row->name,
                    'acciones' => "
                        <a @click.prevent='delete' data-toggle='tooltip' data-placement='top' title='Borrar'><i class='dripicons-trash text-danger'></i></a>
                        &nbsp;&nbsp; 
                        <a @click.prevent='edit' data-toggle='tooltip' data-placement='top' title='Editar' ><i class=' dripicons-document-edit text-success'></i></a>"
                );
            }
            return $ar;
        }

Я добавляю события нажатия в тегах, которые являются моими Действия в таблице, проблема заключается в том, что после отображения таблицы с данными событие click не отображается vue. Кто-нибудь знает, возможно ли то, что я пытаюсь сделать?

Answer 1

добавить этот атрибут в тэг mdb-datatable

:translations="{ countLabel: 'row selected', add: 'Add', edit: 'Edit', delete: 'Delete', selectLabel: 'Show entries', searchLabel: 'Search', prev: 'Previous', next: 'Next', addFormLabel: 'Add new form', addFormBtn: 'Add form', editFormLabel: 'Edit form', editFormBtn: 'Edit form', deleteFormLabel: 'Delete', deleteFormText: 'Are you sure to delete selected row?', deleteFormYes: 'Yes', deleteFormNo: 'No' }"