Я использую Bootstrap-Vue для отображения таблицы, и у меня добавлен в дополнительный столбец с кнопкой обновления с помощью vue-slot. У меня это отображается нормально, и у меня есть метод, вызываемый при нажатии кнопки. В рамках этого метода я могу получить доступ ко всей информации об элементе, но, похоже, я не могу найти способ получить доступ к кнопке. Я хочу отключить его и изменить его содержимое. Как я могу получить доступ к кнопке? Я создал пример кода здесь, который показывает, что я настроил и что мне нужно сделать.
HTML
<div id='app'>
<div>{{ this.output }}</div>
<b-table hover head-variant="dark"
id="pages-table"
:items="items"
:fields="fields">
<template slot="actions" slot-scope="data">
<button class="btn btn-dark" @click="update(data)">Update</button>
</template>
</b-table>
</div>
JavaScript
new Vue({
el: "#app",
data: {
output: null,
items: [
{
id: 1,
name: "Tony"
},
{
id: 2,
name: "John"
},
{
id: 3,
name: "Paul"
}
],
fields: [
{
key: "id",
label: "ID",
sortable: true
},
{ key: "name" },
{ key: "actions" }
]
},
methods: {
update(data) {
// I need to disable the button here
this.output = data;
data.item.name = "Dave";
}
}
});