如何在Vue.js中使用广告位创建表格组件

Question

我正在尝试制作Table组件（如Vuetify表），但是我无法从插槽中取出项目并渲染这些项目。第二个问题我不知道如何在Table.vue中将slot标签与tr结合使用。我该如何解决？

list.vue
<Table :headers="tableHeader" :items="fetchItems">
                <template v-slot:items="props">
                    <td>{{props.item.title}}</td>
                </template>
            </Table>
<script>
return {
tableHeader: [{name: "title", sort: false}, {name: "description", sort: false}]
 fetchItems: [{title: "book 1"},{title: "book 2"}...]
}
</script>

table.vue
<template>
    <table>
        <thead>
        <tr>
            <th v-for="(item, index) in headers" :key="index">{{item.name}}</th>
        </tr>
        </thead>
        <tbody>
        <slot name="items" v-for="(item, index) in items" :key="index"></slot>
        </tbody>
    </table>
</template>
<script>
    export default {
        props: {
            headers: {},
            items: {}
        }
    }
</script>