v-data_table header is not showing

[xarhang]

here is ny code
`


<template #item.actions="{ item }">
<v-icon
small
class="mr-2"
@click="editItem(item)"
>
mdi-pencil

<v-icon
small
@click="deleteItem(item)"
>
mdi-delete

<script> import { ref } from 'vue'; export default { setup() { const headers = ref([ { text: 'My Path', value: 'path' }, { text: 'Permission', value: 'permission' }, { text: 'Rules', value: 'rules' }, { text: 'Actions', value: 'actions', sortable: false } ]); const items = ref([ { path: '/home', permission: 'read', rules: 'none' }, { path: '/settings', permission: 'write', rules: 'admin' } ]); const editItem = (item) => { console.log('Edit item:', item); }; const deleteItem = (item) => { console.log('Delete item:', item); }; return { headers, items, editItem, deleteItem }; } }; </script> <style scoped> /* Add your styles here */ </style>

`
and the datable is missing