Trying to achieve different from documentation experience: showing row details not by clicking on the button, but when row clicked. And documentation is a lack of details on how to make it different as in examples.
<b-table
v-if="tableIsReady"
:items="deals"
:fields="fields"
:per-page="recordsPerPage"
no-local-sorting
@sort-changed="sorting"
responsive
flex
striped
hover
@row-clicked="expandAdditionalInfo"
>
<template slot="row-details" slot-scope="row">
<b-card>
<h1>hello</h1>
</b-card>
</template>
</b-table>
Here is my function but I think it's not working at all
expandAdditionalInfo(row) {
row.showDetails();
}
Hard to find... but just add this:
@row-clicked="item=>$set(item, '_showDetails', !item._showDetails)"
The $set
preserves the reactivity even if _showDetails
didn't exist.
It's a pitty that the row object is not accessible, so toggleDetails is not an option here.