How to render table row conditionally by using v-for and v-if?

         <tbody v-if="show">
                <template v-for="(data,index) in dataTable">
                    <table-row :data="data" :index="index"   :key="index"></table-row>
                </template>

        </tbody>
            
      <tbody v-else>
             <tr class="text-center">
              <td class="text-center" colspan="6"><b-spinner  style="width: 4rem; height: 4rem;" 
                 variant="primary" type="grow" label="Spinning"></b-spinner></td>
            </tr>
     </tbody>







created(){
   this.$store.dispatch('getdeviceswithLocation')
     .then((response)=>{
         this.dataTable=response.data.things;
         console.log(this.dataTable)

    })
     .catch((error)=>{
     console.log(error)
     })
 }


***Table row value comes from api request,***