How can I show and hide a template referring to the current row?

Question

I use Bootstrap Vue table, and I'm trying to show/hide the row item by clicking on a method toggleInnerTable(). This method changes the state of expandedInnerTable[row.item.id] object to true/false. My question is how to make <template v-slot:cell()="row" v-if="expandedInnerTable[row.item.id]"> work? I guess I don't use v-slot:cell()="row" correctly? Any suggestions?

<b-table :items=“items” :fields="fields”>
   <!-- Show details -->
   <template v-slot:cell(show_details)="row">
      <div @click="toggleInnerTable(row.item.id)"> 
         <span v-if="expandedInnerTable[row.item.id]">
            <i class="fa fa-angle-up"></i></span>
         <span v-else><i class="fa fa-angle-right"></i></span>
      </div>
   </template>

   <!-- Inner table - should be open/close depending on expandedInnerTable[row.item.id] state - if it is true or false -->
   <template v-slot:cell()="row" v-if="expandedInnerTable[row.item.id]">
      <b-table :items=“items2” :fields="fields2”>
         …
      </b-table>
       
   </template>
   …

</b-table>