<template>
    <div ref="tableElement" class="cat-table">
        <div class="cat-table__wrapper">
            <table class="cat-table__header" cellspacing="0" cellpadding="0">
                <colgroup>
                    <template v-for="i in 10" :key="i">
                        <col width="400">
                    </template>
                </colgroup>
                <thead>
                    <tr>
                        <template v-for="i in 10" :key="i">
                            <th>
                                <div class="cell">标题就是这么长{{ i }}</div>
                            </th>
                        </template>
                    </tr>
                </thead>
            </table>
        </div>
        <div class="cat-table__wrapper">
            <table class="cat-table__body" cellspacing="0" cellpadding="0">
                <colgroup>
                    <template v-for="i in 10" :key="i">
                        <col width="400">
                    </template>
                </colgroup>
                <tbody>
                    <tr v-for="i in 20" :key="i">
                        <template v-for="n in 10" :key="n">
                            <td>
                                <div class="cell">内容{{ i }}{{ n }}</div>
                            </td>
                        </template>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</template>

<script lang="ts" setup>
</script>

<style lang="less" scoped>
@import './index.less';
</style>