Can I change the data of certain injected component

Hi! First of all thanks for the good package (i'm new to vue)! Now I'm in a situation where I want to change the classes of the injected component that I clicked. So far i following the example from the docs: https://jamesdordoy.github.io/laravel-vue-datatable/examples/injecting-dynamic-components and this is what i got: button component -> <template> <button :class="classes" @click="click(data)" :title="title"> <span> <i class="fa fa-trash" aria-hidden="true"></i> {{ this.title }} </span>   {{ name }} </button> </template>

<script> export default { name: "ToggleActivationButton", data() { return { classes: { 'btn': true, 'btn-danger': true, 'btn-sm': true, }, title: 'Deactivate', } }, props: { data: {}, name: {}, click: { type: Function, default: () => { } }, }, methods: { resolveActive() { if (this.data.deleted_at != null) { this.title = 'Activate'; this.classes = { 'btn': true, 'btn-warning': true, 'btn-sm': true, } } } }, created() { this.resolveActive(); } } </script> <style scoped> </style>

And this is the table:

<template> <div> <data-table :columns="columns" url="http://x.test/admin/sport/list"> </data-table> </div> </template> <script>

import EditButton from "../../buttons/EditButton"; import ToggleActivationButton from "../../buttons/ToggleActivationButton";

export default { name: "SportList", data() { return { columns: [ ... { label: 'Actions', name: 'Edit', orderable: false, classes: { 'btn': true, 'btn-success': true, 'btn-sm': true, }, event: "click", handler: this.editSport, component: EditButton, }, { label: '', orderable: false, event: "click", handler: this.toggleActivation, component: ToggleActivationButton, }, ], error: false, } }, components: { EditButton, ToggleActivationButton, }, methods: { editSport(data) { window.location = 'sport/edit/' + data.id }, toggleActivation(data) { axios.post('sport/toggle-activation/' + data.id, {'sport': data}) .then(response => { let buttonData = ToggleActivationButton.data(); (this return the base component implementation, but not th certain clicked component)

             ` if (response.data.deleted){`
               ` buttonData.title = 'Activate';`
                ` buttonData.classes = {`
                  ` 'btn': true,`
                  ` 'btn-warning': true,`
                  ` 'btn-sm': true,`
                ` };`
                ` return;`
              ` }`

              ` buttonData.title = 'Deactivate';`
              ` buttonData.classes = {`
                ` 'btn': true,`
                ` 'btn-danger': true,`
                ` 'btn-sm': true,`
              ` };`
            ` })`
            ` .catch(error => {`
               `  if (error.response.status === 422) {`

               `  }`
             `});`
   ` }`

}, props: { route: '' } } </script> <style scoped> </style>

I'm currently searching for a way to get the data.classes for clicked element and to change it accordingly. So is there some way to get the component data?

jamesdordoy / laravel-vue-datatable

Can I change the data of certain injected component #127