我的 table 上的标题有一个奇怪的问题,一些标题与顶部对齐但其他标题不对齐,我尝试了所有方法甚至对齐:“左”,但没有成功,这是一张图片我的问题
我的代码是这样的:
*表格:
<v-data-table :headers="header_data" :items="finalData" :search="search" u/click:row="showAlert">
<template v-slot:item.aum="{ item }">
{{formatNumber(item.aum)}}
</template>
</v-data-table>
以及标题的数据:
header_data: [
{ text: 'Name', value: 'fund', align: 'start' },
{ text: 'Ticker', value: 'ticker', align: 'start' },
{ text: 'Asset Class', value: 'assetclass', align: 'start' },
{ text: 'Provider', value: 'issuer', align: 'start' },
{ text: 'Geographic Focus', value: 'region', align: 'start' },
{ text: 'Investment focus', value: 'focus', align: 'start' },
{ text: 'AUM (USD)', value: 'aum', align: 'start' },
]
谢谢!
最佳答案
我不想设置一个固定的宽度,所以作为一个如何用 CSS 解决这个问题的例子:
.v-data-table-header th {
white-space: nowrap;
}
信用 this comment .
关于javascript - 如何在 Vuetify v-data-table 上对齐标题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59645300/