CSmartTable: unable to apply specified table props

[brundabharadwaj]

Tried adding table props to the CSmartTable component and seems like a bug . TableProps , i.e stripped and hover are not being rendered .
using latest version of CSmartTable

Code Snippet:

<script>

import Header from './Header.vue'
import axios from 'axios';
import { CIcon  } from '@coreui/icons-vue';
import {cilPen} from '@coreui/icons'
import { CSmartTable } from '@coreui/vue-pro';
export default{
    name :'HomePage',
    
    components:{
        Header , CSmartTable , CIcon
    },
    data(){
return{
   resturant:{
    name:'',
    location:'',
    contact:''
   
},
columns: [
          {
            key: 'name',
            label: 'Name',
            _props: { scope: 'col' },
          },
          {
            key: 'location',
            label: 'Location',
            _props: { scope: 'col' },
          },
          {
            key: 'contact',
            label: 'Contact',
            _props: { scope: 'col' },
          },
          {
            key: 'action',
            label: 'Action',
            _props: { scope: 'col' },
            slot:'action'
          },
        ],
        items:[]
    
    }},
    setup(){
        return {
            cilPen

        }
    },
  async  mounted(){
       //TEST DATA
         let user = localStorage.getItem("user-info")
            if(!user)
           {this.$router.push({name:'SignUp'})}
           else{
            this.name=JSON.parse(user).name;
              let response =await axios.get("http://localhost:3000/resturants")
              console.log(response)
       this.resturant=response.data;
//this.Resturant=[...resturant]
this.resturant.map(element => {
   this.items.push(element)
});
        }
         }
         
    }
</script>

<template >
    <Header></Header>
 
<CSmartTable :columns="columns" :items="items" style="padding:12px" :tableProps="{striped: true,hover: true,}" >
    <template #action="{ item }">
        <router-link :to='"/update/"+item.id'><CIcon :icon="cilPen" color="skyblue"  width="10%"/></router-link>
    </template>
</CSmartTable>
<!-- <table >
    <tr>
        <th>Name</th>
        <th>Location</th>
        <th>Contact</th>
        <th>Actions</th>
    </tr>
    <tr v-for="item in resturant"  :key=item.id>
 <td>{{ item.name }}</td>
 <td>{{ item.location }}</td>
 <td>{{ item.contact }}</td>
 <script>

import Header from './Header.vue'
import axios from 'axios';
import { CIcon  } from '@coreui/icons-vue';
import {cilPen} from '@coreui/icons'
import { CSmartTable } from '@coreui/vue-pro';
export default{
    name :'HomePage',
    
    components:{
        Header , CSmartTable , CIcon
    },
    data(){
return{
   resturant:{
    name:'',
    location:'',
    contact:''
   
},
columns: [
          {
            key: 'name',
            label: 'Name',
            _props: { scope: 'col' },
          },
          {
            key: 'location',
            label: 'Location',
            _props: { scope: 'col' },
          },
          {
            key: 'contact',
            label: 'Contact',
            _props: { scope: 'col' },
          },
          {
            key: 'action',
            label: 'Action',
            _props: { scope: 'col' },
            slot:'action'
          },
        ],
        items:[]
    
    }},
    setup(){
        return {
            cilPen

        }
    },
  async  mounted(){
       //TEST DATA
         let user = localStorage.getItem("user-info")
            if(!user)
           {this.$router.push({name:'SignUp'})}
           else{
            this.name=JSON.parse(user).name;
              let response =await axios.get("http://localhost:3000/resturants")
              console.log(response)
       this.resturant=response.data;
//this.Resturant=[...resturant]
this.resturant.map(element => {
   this.items.push(element)
});
        }
         }
         
    }
</script>

<template >
    <Header></Header>
 
<CSmartTable :columns="columns" :items="items" style="padding:12px" :tableProps="{striped: true,hover: true,}" >
    <template #action="{ item }">
        <router-link :to='"/update/"+item.id'><CIcon :icon="cilPen" color="skyblue"  width="10%"/></router-link>
    </template>
</CSmartTable>
</template>

Browser : Google Chrome 18.0.5993.89 (Official Build) (64-bit)
OS: Windows 11

[github-actions]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions